0529

.eslintrc.json

@@ -1,24 +1,31 @@
 {
-    "extends": ["airbnb", "prettier"],
-    "plugins": ["prettier"],
-    "parser": "babel-eslint",
-    "env": {
-        "browser": true,
-        "es6": true
-    },
-    "rules": {
-        "import/no-unresolved": 0,
-        "prettier/prettier": 0,
-        "no-unused-vars": ["error", { "vars": "local" ,"varsIgnorePattern": "WebBrowser" }],
-        "no-nested-ternary": 0,
-        "react/no-array-index-key": 0,
-        "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
-        "no-unused-expressions": [
-            "error",
-            { "allowShortCircuit": true, "allowTernary": true }
-        ],
-        "no-param-reassign": 0,
-        "react/prop-types": [0, { "ignore": ["navigation"]}],
-        "react/jsx-props-no-spreading":[1,{"html": "ignore", "exceptions": ["Icon", "props","Avatar","Text"] }]
-    }
+  "extends": ["airbnb", "prettier"],
+  "plugins": ["prettier"],
+  "parser": "babel-eslint",
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+  "rules": {
+    "import/no-unresolved": 0,
+    "prettier/prettier": 0,
+    "no-unused-vars": [
+      "error",
+      { "vars": "local", "varsIgnorePattern": "WebBrowser" }
+    ],
+    "no-nested-ternary": 0,
+    "react/no-array-index-key": 0,
+    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
+    "no-unused-expressions": [
+      "error",
+      { "allowShortCircuit": true, "allowTernary": true }
+    ],
+    "no-param-reassign": 0,
+    "react/prop-types": [0, { "ignore": ["navigation"] }],
+    "react/jsx-props-no-spreading": [
+      1,
+      { "html": "ignore", "exceptions": ["Icon", "props", "Avatar", "Text"] }
+    ],
+    "react/jsx-curly-newline": "off"
+  }
 }

.prettierrc.json

@@ -0,0 +1,10 @@
+{
+    "tabWidth": 2,
+    "useTabs": false,
+    "semi": true,
+    "singleQuote": false,
+    "TrailingCooma": "all",
+    "bracketSpacing": true,
+	"jsxBracketSameLine": false,
+	"arrowParens": "avoid"
+}

App.js

@@ -4,9 +4,9 @@
 import * as React from "react";
 import * as eva from "@eva-design/eva";
 import {
-    ApplicationProvider,
-    Layout,
-    IconRegistry
+  ApplicationProvider,
+  Layout,
+  IconRegistry,
 } from "@ui-kitten/components";
 import { EvaIconsPack } from "@ui-kitten/eva-icons";
 import { SplashScreen } from "expo";
@@ -14,13 +14,13 @@ import * as Font from "expo-font";
 import { Ionicons } from "@expo/vector-icons";
 import { NavigationContainer } from "@react-navigation/native";
 import {
-    createStackNavigator,
-    CardStyleInterpolators,
+  createStackNavigator,
+  CardStyleInterpolators,
 } from "@react-navigation/stack";
 import { useModel } from "flooks";
 import { enableScreens } from "react-native-screens";
 // eslint-disable-next-line no-unused-vars
-import * as model from './models'
+import * as model from "./models";
 import { default as theme } from "./theme.json"; // <-- Import app theme
 import { default as customMapping } from "./mapping.json"; // <-- Import app theme
 import Dialog from "./components/Dialog";
@@ -36,155 +36,148 @@ enableScreens();
 
 const Stack = createStackNavigator();
 
-const fontFile= require("./assets/fonts/SpaceMono-Regular.ttf")
+const fontFile = require("./assets/fonts/SpaceMono-Regular.ttf");
 
 export default function App(props) {
-    const [isLoadingComplete, setLoadingComplete] = React.useState(false);
-    const { getWords } = useModel("wordsModel", true);
-
-    // Load any resources or data that we need prior to rendering the app
-    React.useEffect(() => {
-        async function loadResourcesAndDataAsync() {
-            try {
-                SplashScreen.preventAutoHide();
-                // Load fonts
-                await Font.loadAsync({
-                    ...Ionicons.font,
-                    "space-mono": fontFile,
-                });
+  const [isLoadingComplete, setLoadingComplete] = React.useState(false);
+  const { getWords } = useModel("wordsModel", true);
+
+  // Load any resources or data that we need prior to rendering the app
+  React.useEffect(() => {
+    async function loadResourcesAndDataAsync() {
+      try {
+        SplashScreen.preventAutoHide();
+        // Load fonts
+        await Font.loadAsync({
+          ...Ionicons.font,
+          "space-mono": fontFile,
+        });
+
+        await Font.loadAsync(
+          "antoutline",
+          // eslint-disable-next-line
+          require("@ant-design/icons-react-native/fonts/antoutline.ttf")
+        );
+
+        await Font.loadAsync(
+          "antfill",
+          // eslint-disable-next-line
+          require("@ant-design/icons-react-native/fonts/antfill.ttf")
+        );
+
+        getWords();
+      } catch (e) {
+        // We might want to provide this error information to an error reporting service
+        // eslint-disable-next-line no-console
+        console.log(e);
+      } finally {
+        setLoadingComplete(true);
+        SplashScreen.hide();
+      }
+    }
 
-                getWords();
-            } catch (e) {
-                // We might want to provide this error information to an error reporting service
-                // eslint-disable-next-line no-console
-                console.log(e);
-            } finally {
-                setLoadingComplete(true);
-                SplashScreen.hide();
+    loadResourcesAndDataAsync();
+  }, []);
+
+  const [loginState, setLogin] = React.useState("loading");
+  const {
+    getUserInfo,
+    getGuideStep,
+    initApp,
+    refreashReason,
+    changeInIt,
+  } = useModel("userModel");
+
+  React.useEffect(() => {
+    if (initApp && refreashReason !== "guideStep") {
+      setLogin("loading");
+      getUserInfo()
+        .then(() => {
+          getGuideStep().then(res => {
+            if (res === "finish") {
+              setLogin("login");
+            } else {
+              setLogin(res);
             }
-        }
-
-        loadResourcesAndDataAsync();
-    }, []);
-
-    const [loginState, setLogin] = React.useState("loading");
-    const {
-        getUserInfo,
-        getGuideStep,
-        initApp,
-        refreashReason,
-        changeInIt,
-    } = useModel("userModel");
-
-    React.useEffect(() => {
-        if (initApp && refreashReason !== "guideStep") {
-            setLogin("loading");
-            getUserInfo()
-                .then(() => {
-                    getGuideStep().then(res => {
-                        if (res === "finish") {
-                            setLogin("login");
-                        } else {
-                            setLogin(res);
-                        }
-                    });
-                })
-                .catch(() => {
-                    setLogin("loginOut");
-                })
-                .finally(() => {
-                    changeInIt();
-                });
-        } else if (initApp && refreashReason === "guideStep") {
-            setLogin("loading");
-            getGuideStep()
-                .then(res => {
-                    if (res === "finish") {
-                        setLogin("login");
-                    } else {
-                        setLogin(res);
-                    }
-                })
-                .finally(() => {
-                    changeInIt();
-                });
-        }
-    }, [initApp]);
-
-    if (!isLoadingComplete && !props.skipLoadingScreen) {
-        return null;
+          });
+        })
+        .catch(() => {
+          setLogin("loginOut");
+        })
+        .finally(() => {
+          changeInIt();
+        });
+    } else if (initApp && refreashReason === "guideStep") {
+      setLogin("loading");
+      getGuideStep()
+        .then(res => {
+          if (res === "finish") {
+            setLogin("login");
+          } else {
+            setLogin(res);
+          }
+        })
+        .finally(() => {
+          changeInIt();
+        });
     }
-    return (
-      <>
-        <IconRegistry icons={EvaIconsPack} />
-        <ApplicationProvider
-          {...eva}
-          theme={{ ...eva.light, ...theme }}
-          customMapping={customMapping}
-        >
-          <Loading />
-          <Dialog />
-          <Layout style={{ flex: 1 }}>
-            {loginState !== "loading" && (
+  }, [initApp]);
+
+  if (!isLoadingComplete && !props.skipLoadingScreen) {
+    return null;
+  }
+  return (
+    <>
+      <IconRegistry icons={EvaIconsPack} />
+      <ApplicationProvider
+        {...eva}
+        theme={{ ...eva.light, ...theme }}
+        customMapping={customMapping}
+      >
+        <Loading />
+        <Dialog />
+        <Layout style={{ flex: 1 }}>
+          {loginState !== "loading" && (
             <NavigationContainer ref={navigationRef}>
               <Stack.Navigator
-                headerMode='none'
+                headerMode="none"
                 screenOptions={{
-                                    gestureEnabled: true,
-                                    cardStyleInterpolator:
-                                        CardStyleInterpolators.forHorizontalIOS,
-                                }}
+                  gestureEnabled: true,
+                  cardStyleInterpolator:
+                    CardStyleInterpolators.forHorizontalIOS,
+                }}
+                // initialRouteName="GoodsSpecification"
               >
-                {/* <Stack.Screen
-                                    name='LoadingModel'
-                                    component={LoadingModel}
-                                /> */}
-
                 {GuideScreens(Stack.Screen, loginState)}
 
                 {loginState === "login" && (
-                <Stack.Screen
-                  name='Root'
-                  component={BottomTabNavigator}
-                  options={{
-                                            animationTypeForReplace:
-                                                loginState === "login"
-                                                    ? "pop"
-                                                    : "push",
-                                        }}
-                />
-                                )}
+                  <Stack.Screen
+                    name="Root"
+                    component={BottomTabNavigator}
+                    options={{
+                      animationTypeForReplace:
+                        loginState === "login" ? "pop" : "push",
+                    }}
+                  />
+                )}
                 {loginState === "loginOut" && (
-                <Stack.Screen
-                  name='Login'
-                  component={LoginStackNavigator}
-                  options={{
-                                            animationTypeForReplace:
-                                                loginState === "loginOut"
-                                                    ? "pop"
-                                                    : "push",
-                                        }}
-                />
-                                )}
+                  <Stack.Screen
+                    name="Login"
+                    component={LoginStackNavigator}
+                    options={{
+                      animationTypeForReplace:
+                        loginState === "loginOut" ? "pop" : "push",
+                    }}
+                  />
+                )}
 
                 {/* 基础功能页面 */}
                 {BasicScreens(Stack.Screen)}
               </Stack.Navigator>
             </NavigationContainer>
-                    )}
-          </Layout>
-          {/* <ActionButton
-                        buttonColor='#FFC21C'
-                        offsetY={60}
-                        position='left'
-                        renderIcon={StarIcon}
-                        onPress={()=>{
-
-                        }}
-                    /> */}
-        </ApplicationProvider>
-      </>
-    );
+          )}
+        </Layout>
+      </ApplicationProvider>
+    </>
+  );
 }
-
-

Redux/DataListRedux.js

@@ -1,77 +1,77 @@
-//下拉刷新，获取更多数据处理
+// 下拉刷新，获取更多数据处理
 export const initDataState = {
-    page: 0,
-    size: 20,
-    finish: false,
-    loading: false,
-    refreshing: false,
-    dataList: [],
-    error: "",
+  page: 0,
+  size: 20,
+  finish: false,
+  loading: false,
+  refreshing: false,
+  dataList: [],
+  error: "",
 };
 export function DataListReducer(state, action) {
-    switch (action.type) {
-        case "startRefresh":
-            return {
-                ...state,
-                page: 0,
-                finish: false,
-                refreshing: true,
-                dataList: [],
-            };
-        case "refreshSuccess":
-            return {
-                ...state,
-                refreshing: false,
-            };
-        case "refreshError":
-            return {
-                ...state,
-                error: action.payload.error,
-                dataList: [],
-                refreshing: false,
-            };
-        case "startPageMore":
-            return {
-                ...state,
-                loading: true,
-            };
-        case "pageMoreSuccess":
-            return {
-                ...state,
-                loading: false,
-            };
-        case "pageMoreError":
-            return {
-                ...state,
-                error: action.payload.error,
-                loading: false,
-            };
-        case "setInfo":
-            return {
-                ...state,
-                dataList:
-                    state.page == 0
-                        ? action.payload.list
-                        : state.dataList.concat(action.payload.list),
-                finish: action.payload.finish,
-                page: action.payload.finish ? state.page : state.page + 1,
-            };
-        case "remove": {
-            let list = [...state.dataList];
-            list.splice(action.payload.index, 1);
-            console.log(list);
-            return {
-                ...state,
-                dataList: list,
-            };
-        }
-        case "clear":
-            return {
-                ...state,
-                loading: true,
-                dataList: [],
-            };
-        default:
-            return state;
+  switch (action.type) {
+    case "startRefresh":
+      return {
+        ...state,
+        page: 0,
+        finish: false,
+        refreshing: true,
+        dataList: [],
+      };
+    case "refreshSuccess":
+      return {
+        ...state,
+        refreshing: false,
+      };
+    case "refreshError":
+      return {
+        ...state,
+        error: action.payload.error,
+        dataList: [],
+        refreshing: false,
+      };
+    case "startPageMore":
+      return {
+        ...state,
+        loading: true,
+      };
+    case "pageMoreSuccess":
+      return {
+        ...state,
+        loading: false,
+      };
+    case "pageMoreError":
+      return {
+        ...state,
+        error: action.payload.error,
+        loading: false,
+      };
+    case "setInfo":
+      return {
+        ...state,
+        dataList:
+          state.page === 0
+            ? action.payload.list
+            : state.dataList.concat(action.payload.list),
+        finish: action.payload.finish,
+        page: action.payload.finish ? state.page : state.page + 1,
+      };
+    case "remove": {
+      const list = [...state.dataList];
+      list.splice(action.payload.index, 1);
+    //   console.log(list);
+      return {
+        ...state,
+        dataList: list,
+      };
     }
+    case "clear":
+      return {
+        ...state,
+        refreshing: true,
+        dataList: [],
+      };
+    default:
+      return state;
+  }
 }

babel.config.js

@@ -1,7 +1,14 @@
 module.exports = function (api) {
-    api.cache(true);
-    return {
-        presets: ["babel-preset-expo"],
-        plugins: [["import", { libraryName: "antd-mobile-rn" }]],
-    };
+  api.cache(true);
+  return {
+    presets: ["babel-preset-expo"],
+    plugins: [
+      [
+        "import",
+        {
+          libraryName: "@ant-design/react-native",
+        },
+      ],
+    ],
+  };
 };

components/Coupon.js

@@ -1,88 +1,79 @@
 import React from "react";
-import { StyleSheet } from "react-native";
-import {
-    Modal,
-    Card,
-    Text,
-    Button,
-    Layout,
-    Avatar,
-    Icon,
-} from "@ui-kitten/components";
-import { useModel } from "flooks";
+import { StyleSheet, View } from "react-native";
+import { Card, Text } from "@ui-kitten/components";
+import { SwipeAction } from "@ant-design/react-native";
+
+const styles = StyleSheet.create({
+  main: {
+    flexDirection: "row",
+    alignItems: "center",
+    backgroundColor: "transparent",
+  },
+  left: {
+    width: 80,
+    flexShrink: 0,
+    alignItems: "center",
+  },
+  center: {
+    flex: 1,
+    marginLeft: 14,
+    backgroundColor: "transparent",
+  },
+  text2: {
+    paddingTop: 6,
+  },
+  code: {
+    alignSelf: "flex-start",
+  },
+  icon: {
+    width: 20,
+    position: "absolute",
+    right: 0,
+    top: "50%",
+    marginTop: -10,
+  },
+});
 
 export default function Coupon(props) {
-    const { getWordsStr } = useModel("wordsModel");
-    const { info } = props;
-    const { id, amount, fullAmount, name, endDate, startDate } = info || {};
-    const code = React.useMemo(() => {
-        if (amount) {
-            return (amount > 0 ? "+ " : "- ") + amount.toFixed(2);
-        } else {
-            return "+ 0.00";
-        }
-    }, [amount]);
-    return (
-        <Card appearance='walletCard'>
-            <Layout style={styles.main}>
-                <Layout style={styles.left}>
-                    <Text category='h6' status='danger'>
-                        <Text category='h1' status='danger'>¥</Text>
-                        {amount}
-                    </Text>
-                    <Text category='h1' status='info'>
-                        {fullAmount
-                            ? "满" + fullAmount + "元可用"
-                            : "无金额门槛"}
-                    </Text>
-                </Layout>
-                <Layout style={styles.center}>
-                    <Text category='h6'>{name}</Text>
-                    <Text category='h1' status='info' style={styles.text2}>
-                        {startDate}
-                        {endDate}
-                    </Text>
-                </Layout>
-            </Layout>
-        </Card>
-    );
-}
+  const { info, delEvent, onPress } = props;
+  const { amount, fullAmount, name, endDate, startDate } = info || {};
 
-const ForwardIcon = props => (
-    <Icon
-        {...props}
-        name='arrow-ios-forward'
-        fill='#B4B4B4'
-        style={{ width: 15, height: 15, fontWeight: 500 }}
-    />
-);
-const styles = StyleSheet.create({
-    main: {
-        flexDirection: "row",
-        alignItems: "center",
-        backgroundColor: "transparent",
-    },
-    left: {
-        width: 80,
-        flexShrink: 0,
-        alignItems: "center",
-    },
-    center: {
-        flex: 1,
-        marginLeft: 14,
-        backgroundColor: "transparent",
+  const right = [
+    {
+      text: "删除",
+      onPress: delEvent,
+      style: { backgroundColor: "red", color: "white" },
     },
-    text2: {
-        paddingTop: 6,
-    },
-    code: {
-        alignSelf: "flex-start",
-    },
-    icon: {
-        width: 20,
-        position: "absolute",
-        right: 0,
-        top: "50%",
-        marginTop: -10,
-    },
-});
+  ];
+
+  return (
+    <SwipeAction
+      autoClose
+      style={{ backgroundColor: "transparent" }}
+      right={right}
+    >
+      <Card appearance="walletCard" onPress={onPress}>
+        <View style={styles.main}>
+          <View style={styles.left}>
+            <Text category="h6" status="danger">
+              <Text category="h1" status="danger">
+                ¥
+              </Text>
+              {amount}
+            </Text>
+            <Text category="h1" status="info">
+              {fullAmount ? `满 ${fullAmount} 元可用` : "无金额门槛"}
+            </Text>
+          </View>
+          <View style={styles.center}>
+            <Text category="h6">{name}</Text>
+            <Text category="h1" status="info" style={styles.text2}>
+              {startDate}
+              {endDate}
+            </Text>
+          </View>
+        </View>
+      </Card>
+    </SwipeAction>
+  );
+}

components/EmptyComponent.js

@@ -1,20 +1,20 @@
 import * as React from "react";
-import {  Text } from "@ui-kitten/components";
+import { Text } from "@ui-kitten/components";
 import { useModel } from "flooks";
 
 export default function EmptyComponent() {
-    const { nothingTips } = useModel("wordsModel");
-    return (
-      <Text
-        category='h1'
-        status='info'
-        style={{
-                textAlign: "center",
-                backgroundColor: "transparent",
-                paddingVertical: 20,
-            }}
-      >
-        {nothingTips}
-      </Text>
-    );
+  const { nothingTips } = useModel("wordsModel");
+  return (
+    <Text
+      category="h1"
+      status="info"
+      style={{
+        textAlign: "center",
+        backgroundColor: "transparent",
+        paddingVertical: 20,
+      }}
+    >
+      {nothingTips}
+    </Text>
+  );
 }

components/GoodsCard.js

@@ -1,196 +1,174 @@
 import React from "react";
-import { StyleSheet } from "react-native";
-import {
-    Card,
-    Text,
-    Button,
-    Layout,
-    Avatar,
-} from "@ui-kitten/components";
+import { StyleSheet, View } from "react-native";
+import { Card, Text, Button, Avatar } from "@ui-kitten/components";
 import { useModel } from "flooks";
 
-
 const styles = StyleSheet.create({
-    card: { marginTop: 10 },
-    layout: {
-        flexDirection: "row",
-        height: 80,
-        backgroundColor: "transparent",
-    },
-    avatar: {
-        width: 80,
-        height: 80,
-        marginRight: 10,
-    },
-    main: {
-        flex: 1,
-        backgroundColor: "transparent",
-    },
-    flex1: {
-        flex: 1,
-    },
-    butContent: {
-        marginLeft: 6,
-    },
-    fontColor: {
-        color: "#B5B5B5",
-    },
-    miniButton: {
-        minWidth: 22,
-        minHeight: 22,
-        width: 22,
-        height: 22,
-        position: "absolute",
-        right: 10,
-        bottom: 5,
-        maxWidth: 22,
-    },
-    status: {
-        position: "absolute",
-        left: 0,
-        width: 80,
-        paddingVertical: 4,
-        backgroundColor: "#F0F0F0",
-        bottom: 0,
-        textAlign: "center",
-    },
+  card: { marginTop: 10 },
+  layout: {
+    flexDirection: "row",
+    height: 80,
+    backgroundColor: "transparent",
+  },
+  avatar: {
+    width: 80,
+    height: 80,
+    marginRight: 10,
+  },
+  main: {
+    flex: 1,
+    backgroundColor: "transparent",
+  },
+  flex1: {
+    flex: 1,
+  },
+  butContent: {
+    marginLeft: 6,
+  },
+  fontColor: {
+    color: "#B5B5B5",
+  },
+  miniButton: {
+    minWidth: 22,
+    minHeight: 22,
+    width: 22,
+    height: 22,
+    position: "absolute",
+    right: 10,
+    bottom: 5,
+    maxWidth: 22,
+  },
+  status: {
+    position: "absolute",
+    left: 0,
+    width: 80,
+    paddingVertical: 4,
+    backgroundColor: "#F0F0F0",
+    bottom: 0,
+    textAlign: "center",
+  },
 });
 
-
 export default function GoodsCard(props) {
-    const { add, remove, getWordsStr } = useModel("wordsModel");
-    const { info, changeInfo,type,removeEvent,addEvent,isAdd,appearance,style,canEdit,onPress } = props;
-    const {
-        id,
-        img,
-        name,
-        introduction,
-        totalSales,
-        discountAmount,
-        amount,
-        takeOff,
-        status,
-    } = info || {};
-
-    const { takeOffInfo, ChangeTakeOff } = useModel("goodsModel", true);
-
-    
-
+  const { add, remove, getWordsStr } = useModel("wordsModel");
+  const {
+    info,
+    changeInfo,
+    type,
+    removeEvent,
+    addEvent,
+    isAdd,
+    appearance,
+    style,
+    canEdit,
+    onPress,
+  } = props;
+  const {
+    id,
+    img,
+    name,
+    introduction,
+    totalSales,
+    discountAmount,
+    amount,
+    takeOff,
+    status,
+  } = info || {};
 
+  const { takeOffInfo, ChangeTakeOff } = useModel("goodsModel", true);
 
-    return (
-      <Card
-        style={[!appearance && styles.card, style]}
-        appearance={appearance || "goodsCard"}
-        disabled={!canEdit}
-        onPress={onPress}
-      >
-        {id ? (
-          <Layout style={styles.layout}>
-            <Avatar
-              style={styles.avatar}
-              shape='rounded'
-              source={{
-                            uri: img,
-                        }}
-            />
-            {status === "PENDING" && (
-            <Text style={styles.status} category='h1'>
+  return (
+    <Card
+      style={[!appearance && styles.card, style]}
+      appearance={appearance || "goodsCard"}
+      disabled={!canEdit}
+      onPress={onPress}
+    >
+      {id ? (
+        <View style={styles.layout}>
+          <Avatar
+            style={styles.avatar}
+            shape="rounded"
+            source={{
+              uri: img,
+            }}
+          />
+          {status === "PENDING" && (
+            <Text style={styles.status} category="h1">
               待审核
             </Text>
-                    )}
-            {status === "DENY" && (
+          )}
+          {status === "DENY" && (
+            <Text style={styles.status} category="h1" status="danger">
+              审核未通过
+            </Text>
+          )}
+          <View style={styles.main}>
+            <Text category="s1" ellipsizeMode="tail" numberOfLines={1}>
+              {name || ""}
+            </Text>
             <Text
-              style={styles.status}
-              category='h1'
-              status='danger'
+              category="c1"
+              status="info"
+              ellipsizeMode="tail"
+              numberOfLines={1}
             >
-              审核未通过
+              {introduction || ""}
             </Text>
-                    )}
-            <Layout style={styles.main}>
-              <Text
-                category='s1'
-                ellipsizeMode='tail'
-                numberOfLines={1}
-              >
-                {name || ""}
-              </Text>
+            <Text category="c1" status="info">
+              月售 {totalSales || 0}
+            </Text>
+            <View style={styles.flex1} />
+            <Text category="h6" status="danger">
+              ¥{discountAmount}{" "}
               <Text
-                category='c1'
-                status='info'
-                ellipsizeMode='tail'
-                numberOfLines={1}
+                category="h1"
+                status="info"
+                style={{ textDecorationLine: "line-through" }}
               >
-                {introduction || ""}
-              </Text>
-              <Text category='c1' status='info'>
-                月售 
-                {' '}
-                {totalSales || 0}
-              </Text>
-              <Layout style={styles.flex1} />
-              <Text category='h6' status='danger'>
-                ¥
-                {discountAmount}
-                {" "}
-                <Text
-                  category='h1'
-                  status='info'
-                  style={{ textDecorationLine: "line-through" }}
-                >
-                  ¥
-                  {amount}
-                </Text>
+                ¥{amount}
               </Text>
-            </Layout>
-            {appearance && type === "goodsList" && (
-            <Layout style={styles.butContent}>
+            </Text>
+          </View>
+          {appearance && type === "goodsList" && (
+            <View style={styles.butContent}>
               <Button
-                status='primary'
-                size='small'
-                appearance='outline'
+                status="primary"
+                size="small"
+                appearance="outline"
                 onPress={() => {
-                                    if (!takeOff) {
-                                        takeOffInfo(() => {
-                                            ChangeTakeOff(info).then(res => {
-                                                changeInfo(res);
-                                            });
-                                        });
-                                    } else {
-                                        ChangeTakeOff(info).then(res => {
-                                            changeInfo(res);
-                                        });
-                                    }
-                                }}
+                  if (!takeOff) {
+                    takeOffInfo(() => {
+                      ChangeTakeOff(info).then(res => {
+                        changeInfo(res);
+                      });
+                    });
+                  } else {
+                    ChangeTakeOff(info).then(res => {
+                      changeInfo(res);
+                    });
+                  }
+                }}
               >
                 {getWordsStr(takeOff ? "takeUp" : "takeOff")}
               </Button>
-            </Layout>
-                    )}
-            {!appearance && !isAdd && (
-            <Layout style={styles.butContent}>
-              <Button
-                status='primary'
-                size='tiny'
-                onPress={addEvent}
-              >
+            </View>
+          )}
+          {!appearance && !isAdd && (
+            <View style={styles.butContent}>
+              <Button status="primary" size="tiny" onPress={addEvent}>
                 {add}
               </Button>
-            </Layout>
-                    )}
-            {appearance && isAdd && (
-            <Layout style={styles.butContent}>
-              <Button
-                status='danger'
-                onPress={removeEvent}
-                size='tiny'
-              >
+            </View>
+          )}
+          {appearance && isAdd && (
+            <View style={styles.butContent}>
+              <Button status="danger" onPress={removeEvent} size="tiny">
                 {remove}
               </Button>
-            </Layout>
-                    )}
-            {/* {props.appearance == "classification" &&
+            </View>
+          )}
+          {/* {props.appearance == "classification" &&
                         props.type != "goodsList" && (
                             <Button
                                 style={styles.miniButton}
@@ -199,10 +177,10 @@ export default function GoodsCard(props) {
                                 accessoryLeft={StarIcon}
                             />
                         )} */}
-          </Layout>
-            ) : (
-              <Layout style={styles.layout} />
-            )}
-      </Card>
-    );
+        </View>
+      ) : (
+        <View style={styles.layout} />
+      )}
+    </Card>
+  );
 }

components/ListComponent.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-console */
 /* eslint-disable react/jsx-props-no-spreading */
 /* eslint-disable no-underscore-dangle */
 import React from "react";
@@ -7,147 +8,146 @@ import { initDataState, DataListReducer } from "../Redux/DataListRedux";
 import EmptyComponent from "./EmptyComponent";
 
 export default function ListComponent(props) {
-    const [state, dispatch] = React.useReducer(DataListReducer, initDataState);
-    const { page, size, loading, refreshing, dataList } = state;
-    const {
-        getInfo,
-        renderItem,
-        ListHeaderComponent,
-        style,
-        separatorStyle,
-        ListFooterComponent,
-        showEmpty,
-        emptyEvent,
-        showList,
-        extraData,
-        delId,
-        startState, // 父级调刷新
-        initialNumToRender,
-    } = props;
+  const [state, dispatch] = React.useReducer(DataListReducer, initDataState);
+  const { page, size, loading, refreshing, dataList } = state;
+  const {
+    getInfo,
+    renderItem,
+    ListHeaderComponent,
+    style,
+    separatorStyle,
+    ListFooterComponent,
+    showEmpty,
+    emptyEvent,
+    showList,
+    extraData,
+    delId,
+    startState, // 父级调刷新
+    initialNumToRender,
+    saveList, // 保持状态
+  } = props;
 
-  
-    function getList() {
-        if (getInfo != null) {
-            return getInfo(page, size).then(res => {
-                if (emptyEvent) {
-                    if (res.numberOfElements === 0) {
-                        emptyEvent(true);
-                    } else {
-                        emptyEvent(false);
-                    }
-                }
+  function getList() {
+    if (getInfo != null) {
+      return getInfo(page, size).then(res => {
+        if (emptyEvent) {
+          if (res.numberOfElements === 0) {
+            emptyEvent(true);
+          } else {
+            emptyEvent(false);
+          }
+        }
 
-                dispatch({
-                    type: "setInfo",
-                    payload: { list: res.content, finish: res.last },
-                });
-            });
-        } 
-            return Promise.reject();
-        
+        dispatch({
+          type: "setInfo",
+          payload: { list: res.content, finish: res.last },
+        });
+      });
     }
+    return Promise.reject();
+  }
 
-    React.useEffect(() => {
-        if (delId) {
-            const list = [...dataList];
-            const Index = list.findIndex(item => {
-                return item.id === delId;
-            });
-            if (Index !== -1) {
-                dispatch({
-                    type: "remove",
-                    payload: { index: Index },
-                });
-            }
-        }
-    }, [delId]);
+  React.useEffect(() => {
+    if (delId) {
+      const list = [...dataList];
+      const Index = list.findIndex(item => {
+        return item.id === delId;
+      });
+      if (Index !== -1) {
+        dispatch({
+          type: "remove",
+          payload: { index: Index },
+        });
+      }
+    }
+  }, [delId]);
 
-    // 刷新接口
-    function onRefresh() {
-        dispatch({ type: "startRefresh" });
+  // 刷新接口
+  function onRefresh() {
+    dispatch({ type: "startRefresh" });
 
-        getList()
-            .then(() => {
-                dispatch({ type: "refreshSuccess" });
-            })
-            .catch(e => {
-                dispatch({
-                    type: "refreshError",
-                    payload: { error: e.message },
-                });
-            });
-    }
+    getList()
+      .then(() => {
+        dispatch({ type: "refreshSuccess" });
+      })
+      .catch(e => {
+        dispatch({
+          type: "refreshError",
+          payload: { error: e.message },
+        });
+      });
+  }
 
-    // 到页面底部加载更多
-    function gotEnd() {
-        dispatch({ type: "startPageMore" });
-        getList()
-            .then(() => {
-                dispatch({ type: "pageMoreSuccess" });
-            })
-            .catch(e => {
-                dispatch({
-                    type: "pageMoreError",
-                    payload: { error: e.message },
-                });
-            });
-	}
-	
-	  useFocusEffect(
-        React.useCallback(() => {
-            dispatch({
-                type: "clear",
-            });
-            if (startState !== false) {
-                onRefresh();
-            }
-        }, [])
-    );
-    React.useEffect(() => {
-        if (startState) {
-            onRefresh();
-        }
-    }, [startState]);
+  // 到页面底部加载更多
+  function gotEnd() {
+    dispatch({ type: "startPageMore" });
+    getList()
+      .then(() => {
+        dispatch({ type: "pageMoreSuccess" });
+      })
+      .catch(e => {
+        dispatch({
+          type: "pageMoreError",
+          payload: { error: e.message },
+        });
+      });
+  }
 
+  useFocusEffect(
+    React.useCallback(() => {
+      if (saveList !== true) {
+        dispatch({
+          type: "clear",
+        });
+      }
+      if (startState !== false) {
+        onRefresh();
+      }
+    }, [])
+  );
+  React.useEffect(() => {
+    if (startState) {
+      onRefresh();
+    }
+  }, [startState]);
 
-    const changePorps = React.useMemo(() => {
-        let _props = { renderItem: () => <Layout /> };
-        if (showList !== false) {
-            _props = { renderItem };
+  const changePorps = React.useMemo(() => {
+    let _props = { renderItem: () => <Layout /> };
+    if (showList !== false) {
+      _props = { renderItem };
 
-            if (extraData) {
-                _props = {
-                    ..._props,
-                    extraData,
-                };
-            }
-        }
-        return _props;
-    }, [showList, showEmpty, extraData]);
+      if (extraData) {
+        _props = {
+          ..._props,
+          extraData,
+        };
+      }
+    }
+    return _props;
+  }, [showList, extraData]);
 
-    const ListEmptyComponent = React.useMemo(() => {
-        if (showEmpty && !refreshing && !loading) {
-            return EmptyComponent;
-        } 
-            return <></>;
-        
-    }, [showEmpty, refreshing, loading]);
+  const ListEmptyComponent = React.useMemo(() => {
+    if (showEmpty && !refreshing && !loading) {
+      return EmptyComponent;
+    }
+    return <></>;
+  }, [showEmpty, refreshing, loading]);
 
-    return (
-      <List
-        refreshing={refreshing}
-        style={[style]}
-        data={dataList}
-        removeClippedSubviews
-        initialNumToRender={initialNumToRender || 0}
-        ListHeaderComponent={ListHeaderComponent}
-        ListEmptyComponent={ListEmptyComponent}
-        onRefresh={onRefresh}
-        onEndReached={0.2}
-        ItemSeparatorComponent={() => <Divider style={[separatorStyle]} />}
-        onEndReachedThreshold={gotEnd}
-        ListFooterComponent={ListFooterComponent}
-        {...changePorps}
-      />
-    );
+  return (
+    <List
+      refreshing={refreshing}
+      style={[style]}
+      data={dataList}
+      removeClippedSubviews
+      initialNumToRender={initialNumToRender || 10}
+      ListHeaderComponent={ListHeaderComponent}
+      ListEmptyComponent={ListEmptyComponent}
+      onRefresh={onRefresh}
+      onEndReached={0.2}
+      ItemSeparatorComponent={() => <Divider style={[separatorStyle]} />}
+      onEndReachedThreshold={gotEnd}
+      ListFooterComponent={ListFooterComponent}
+      {...changePorps}
+    />
+  );
 }

models/couponModel.js

@@ -4,54 +4,72 @@
 import * as TimeUtil from "../Utils/TimeUtil";
 
 export default {
-    state: {
-        defaultStartTime: TimeUtil.getDateStr(),
-        defaultEndTime: TimeUtil.getAddDateStr(),
-    },
-    actions: ({ model, setState }) => ({
-        // 获取商家优惠券
-        getMyList(page, size) {
-            const { mid } = model("userModel");
-            const { httpGet } = model("httpModel");
-            return httpGet(
-                "/coupon/all",
-                {
-                    page,
-                    size,
-                    query: {
-                        merchantId: mid,
-                    },
-                },
-                true
-            );
+  state: {
+    defaultStartTime: TimeUtil.getDateStr(),
+    defaultEndTime: TimeUtil.getAddDateStr(),
+    couponList: [],
+  },
+  actions: ({ model, setState }) => ({
+    // 获取商家优惠券
+    getMyList(page, size) {
+      const { mid } = model("userModel");
+      const { httpGet } = model("httpModel");
+      return httpGet(
+        "/coupon/all",
+        {
+          page,
+          size,
+          query: {
+            merchantId: mid,
+          },
+          sort: "id,desc",
         },
-        saveInfo(info) {
-            const { httpPost } = model("httpModel");
-            const { mid } = model("userModel");
-            const { success } = model("loadingModel");
-            return httpPost(
-                "/coupon/save",
-                {
-                    ...info,
-                    merchantId: mid,
-                },
-                { body: "json" },
-                true
-            ).then(res => {
-                success("保存成功");
-                return Promise.resolve(res);
-            });
+        true
+      );
+    },
+    saveInfo(info) {
+      const { httpPost } = model("httpModel");
+      const { mid } = model("userModel");
+      const { success } = model("loadingModel");
+      return httpPost(
+        "/coupon/save",
+        {
+          ...info,
+          merchantId: mid,
         },
-        removeInfo(id) {
-            const { removeEvent } = model("dialogModel");
-            const { success } = model("loadingModel");
-            const { httpPost } = model("httpModel");
-            removeEvent(() => {
-                httpPost(`/coupon/del/${  id}`, {}, true).then(res => {
-                    success("删除成功");
-                    return Promise.resolve(res);
-                });
-            });
+        { body: "json" },
+        true
+      ).then(res => {
+        success("保存成功");
+        return Promise.resolve(res);
+      });
+    },
+    delCoupon(id, callBack) {
+      const { showDialog } = model("dialogModel");
+      const { removeInfo } = model();
+      //   const { takeOffTips } = model("wordsModel");
+      showDialog({
+        bodyText: "确定要删除，该优惠券吗",
+        status: "danger",
+        cancelable: true,
+        confirmCallback: () => {
+          removeInfo(id).then(() => {
+            callBack();
+          });
         },
-    }),
+      });
+    },
+    removeInfo(id) {
+      const { success } = model("loadingModel");
+      const { httpPost } = model("httpModel");
+      return httpPost(`/coupon/del/${id}`, {}, {}, true).then(res => {
+        success("删除成功");
+        return Promise.resolve(res);
+      });
+    },
+    getInfo(id) {
+      const { httpGet } = model("httpModel");
+      return httpGet(`/coupon/get/${id}`, {}, true);
+    },
+  }),
 };

navigation/BasicNavigator.js

@@ -22,7 +22,6 @@ export default function BasicScreens(Screen) {
         <Screen
           name='AddClassification'
           component={AddGoodsClassification}
-          initialParams={{ type: "signboard" }}
         />
         <Screen name='FullReduction' component={FullReduction} />
         <Screen name='AddNewClass' component={Guide2Screen} />

package-lock.json

@@ -2,6 +2,31 @@
   "requires": true,
   "lockfileVersion": 1,
   "dependencies": {
+    "@ant-design/icons-react-native": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/@ant-design/icons-react-native/-/icons-react-native-2.2.1.tgz",
+      "integrity": "sha512-4hjvlhyVNBrkctMe22moR6qgXwro0pXFlUsI6vNQSqv3W6FqPoVVXGy9nKaF3vDWiO0jUW9CnMYicyf7pwwkWw=="
+    },
+    "@ant-design/react-native": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/@ant-design/react-native/-/react-native-3.3.0.tgz",
+      "integrity": "sha512-Gxck2jIYaUKI2TiL5CZ2vGcAJozL005daINI7ZTAfpAWoZAX2B1bI4emdf6+9ur7evyvsAVVzLl3b+28tRsQYA==",
+      "requires": {
+        "@ant-design/icons-react-native": "^2.0.0",
+        "@bang88/react-native-drawer-layout": "^2.0.3",
+        "@bang88/react-native-ultimate-listview": "^3.3.0",
+        "@react-native-community/viewpager": "^1.1.7",
+        "array-tree-filter": "~2.1.0",
+        "babel-runtime": "^6.x",
+        "deepmerge": "^3.0.0",
+        "normalize-css-color": "^1.0.2",
+        "react-native-collapsible": "^1.4.0",
+        "react-native-modal-popover": "^0.0.12",
+        "react-native-safe-area-view": "^0.11.0",
+        "react-native-swipeout": "^2.3.6",
+        "utility-types": "^2.1.0"
+      }
+    },
     "@babel/cli": {
       "version": "7.10.1",
       "resolved": "https://registry.npmjs.org/@babel/cli/-/cli-7.10.1.tgz",
@@ -1024,6 +1049,16 @@
         "@babel/plugin-syntax-jsx": "^7.10.1"
       }
     },
+    "@babel/plugin-transform-react-jsx-self": {
+      "version": "7.10.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.10.1.tgz",
+      "integrity": "sha512-4p+RBw9d1qV4S749J42ZooeQaBomFPrSxa9JONLHJ1TxCBo3TzJ79vtmG2S2erUT8PDDrPdw4ZbXGr2/1+dILA==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-plugin-utils": "^7.10.1",
+        "@babel/plugin-syntax-jsx": "^7.10.1"
+      }
+    },
     "@babel/plugin-transform-react-jsx-source": {
       "version": "7.10.1",
       "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.10.1.tgz",
@@ -1312,6 +1347,16 @@
         "to-fast-properties": "^2.0.0"
       }
     },
+    "@bang88/react-native-drawer-layout": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@bang88/react-native-drawer-layout/-/react-native-drawer-layout-2.0.3.tgz",
+      "integrity": "sha512-rSMgODo8G8bBxLiR4YD9FVLx0U+0/6ABFbfBQ/2PjMNBFjqa6IiAK1uTivMjRgykri1EacDHb81Qd/DkqUrHJw=="
+    },
+    "@bang88/react-native-ultimate-listview": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/@bang88/react-native-ultimate-listview/-/react-native-ultimate-listview-3.3.0.tgz",
+      "integrity": "sha512-qRH8YV1Hi0dJpSQ9VCoWMVFuvxwZ4F5N73fqYMjSh0tGlG/p95WlaM/WVg9PFMphP5Sv5FO0p+vbBKWrbwdE0g=="
+    },
     "@cnakazawa/watch": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz",
@@ -2921,6 +2966,11 @@
       "resolved": "https://registry.npmjs.org/@react-native-community/masked-view/-/masked-view-0.1.6.tgz",
       "integrity": "sha512-PpMoeXwPUoldCRKDuSi+zK5rT+sJTW6ri6RdGPkSKRzU77Q1d9IaR0O5IKvBj0XSdL3p+dcOa05gk35aGDffBQ=="
     },
+    "@react-native-community/viewpager": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/@react-native-community/viewpager/-/viewpager-1.1.7.tgz",
+      "integrity": "sha512-k9v2KJtAprNPq7IZmedD2VLMePvPW+ohX3uDnkpoKritBji+/RtRmTKrdtPi3Uvp0toq/KtPttAds1dr7AZNpw=="
+    },
     "@react-navigation/bottom-tabs": {
       "version": "5.5.1",
       "resolved": "https://registry.npmjs.org/@react-navigation/bottom-tabs/-/bottom-tabs-5.5.1.tgz",
@@ -3141,6 +3191,11 @@
       "integrity": "sha512-90hiq6/VqtQgX8Sp0EzeIsv3r+ellbGj4URKj5j30tLlZvRUpnAe9YbYnjl3pJM93GyXU0tghHhvXHq+5rnCKA==",
       "dev": true
     },
+    "@types/prop-types": {
+      "version": "15.7.3",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
+      "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
+    },
     "@types/q": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.4.tgz",
@@ -3835,6 +3890,11 @@
       "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
       "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
     },
+    "array-tree-filter": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/array-tree-filter/-/array-tree-filter-2.1.0.tgz",
+      "integrity": "sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw=="
+    },
     "array-union": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
@@ -4281,6 +4341,50 @@
         "babel-plugin-module-resolver": "^3.2.0",
         "babel-plugin-react-native-web": "^0.11.7",
         "metro-react-native-babel-preset": "^0.56.0"
+      },
+      "dependencies": {
+        "metro-react-native-babel-preset": {
+          "version": "0.56.4",
+          "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.56.4.tgz",
+          "integrity": "sha512-CzbBDM9Rh6w8s1fq+ZqihAh7DDqUAcfo9pPww25+N/eJ7UK436Q7JdfxwdIPpBwLFn6o6MyYn+uwL9OEWBJarA==",
+          "requires": {
+            "@babel/plugin-proposal-class-properties": "^7.0.0",
+            "@babel/plugin-proposal-export-default-from": "^7.0.0",
+            "@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
+            "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
+            "@babel/plugin-proposal-optional-catch-binding": "^7.0.0",
+            "@babel/plugin-proposal-optional-chaining": "^7.0.0",
+            "@babel/plugin-syntax-dynamic-import": "^7.0.0",
+            "@babel/plugin-syntax-export-default-from": "^7.0.0",
+            "@babel/plugin-syntax-flow": "^7.2.0",
+            "@babel/plugin-transform-arrow-functions": "^7.0.0",
+            "@babel/plugin-transform-block-scoping": "^7.0.0",
+            "@babel/plugin-transform-classes": "^7.0.0",
+            "@babel/plugin-transform-computed-properties": "^7.0.0",
+            "@babel/plugin-transform-destructuring": "^7.0.0",
+            "@babel/plugin-transform-exponentiation-operator": "^7.0.0",
+            "@babel/plugin-transform-flow-strip-types": "^7.0.0",
+            "@babel/plugin-transform-for-of": "^7.0.0",
+            "@babel/plugin-transform-function-name": "^7.0.0",
+            "@babel/plugin-transform-literals": "^7.0.0",
+            "@babel/plugin-transform-modules-commonjs": "^7.0.0",
+            "@babel/plugin-transform-object-assign": "^7.0.0",
+            "@babel/plugin-transform-parameters": "^7.0.0",
+            "@babel/plugin-transform-react-display-name": "^7.0.0",
+            "@babel/plugin-transform-react-jsx": "^7.0.0",
+            "@babel/plugin-transform-react-jsx-source": "^7.0.0",
+            "@babel/plugin-transform-regenerator": "^7.0.0",
+            "@babel/plugin-transform-runtime": "^7.0.0",
+            "@babel/plugin-transform-shorthand-properties": "^7.0.0",
+            "@babel/plugin-transform-spread": "^7.0.0",
+            "@babel/plugin-transform-sticky-regex": "^7.0.0",
+            "@babel/plugin-transform-template-literals": "^7.0.0",
+            "@babel/plugin-transform-typescript": "^7.0.0",
+            "@babel/plugin-transform-unicode-regex": "^7.0.0",
+            "@babel/template": "^7.0.0",
+            "react-refresh": "^0.4.0"
+          }
+        }
       }
     },
     "babel-preset-fbjs": {
@@ -4331,7 +4435,6 @@
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
       "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
-      "dev": true,
       "requires": {
         "core-js": "^2.4.0",
         "regenerator-runtime": "^0.11.0"
@@ -4340,8 +4443,7 @@
         "regenerator-runtime": {
           "version": "0.11.1",
           "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
-          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
-          "dev": true
+          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
         }
       }
     },
@@ -4441,6 +4543,14 @@
         "moment": "^2.24.0"
       }
     },
+    "better-scroll": {
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/better-scroll/-/better-scroll-1.15.1.tgz",
+      "integrity": "sha512-HL+jm6tk2pBylSZBfZLtfdwNhGckLbwiBAEx+Z2+8PrHJ6QAZp96txOVEFWSBgUAwPg5YSioMOxMqws5GdkXKA==",
+      "requires": {
+        "babel-runtime": "^6.0.0"
+      }
+    },
     "big-integer": {
       "version": "1.6.48",
       "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.48.tgz",
@@ -4945,6 +5055,11 @@
         }
       }
     },
+    "classnames": {
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
+      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
+    },
     "clean-css": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz",
@@ -5441,6 +5556,36 @@
         }
       }
     },
+    "create-react-context": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.2.3.tgz",
+      "integrity": "sha512-CQBmD0+QGgTaxDL3OX1IDXYqjkp2It4RIbcb99jS6AEg27Ga+a9G3JtK6SIu0HBwPLZlmwt9F7UwWA4Bn92Rag==",
+      "requires": {
+        "fbjs": "^0.8.0",
+        "gud": "^1.0.0"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        },
+        "fbjs": {
+          "version": "0.8.17",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz",
+          "integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=",
+          "requires": {
+            "core-js": "^1.0.0",
+            "isomorphic-fetch": "^2.1.1",
+            "loose-envify": "^1.0.0",
+            "object-assign": "^4.1.0",
+            "promise": "^7.1.1",
+            "setimmediate": "^1.0.5",
+            "ua-parser-js": "^0.7.18"
+          }
+        }
+      }
+    },
     "cross-spawn": {
       "version": "6.0.5",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
@@ -8017,6 +8162,11 @@
       "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
       "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
     },
+    "gud": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
+      "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
+    },
     "gzip-size": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
@@ -10714,6 +10864,11 @@
       "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
       "dev": true
     },
+    "lodash.debounce": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
+      "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
+    },
     "lodash.find": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.find/-/lodash.find-4.6.0.tgz",
@@ -11091,6 +11246,48 @@
             "mimic-fn": "^1.0.0"
           }
         },
+        "metro-react-native-babel-preset": {
+          "version": "0.56.4",
+          "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.56.4.tgz",
+          "integrity": "sha512-CzbBDM9Rh6w8s1fq+ZqihAh7DDqUAcfo9pPww25+N/eJ7UK436Q7JdfxwdIPpBwLFn6o6MyYn+uwL9OEWBJarA==",
+          "requires": {
+            "@babel/plugin-proposal-class-properties": "^7.0.0",
+            "@babel/plugin-proposal-export-default-from": "^7.0.0",
+            "@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
+            "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
+            "@babel/plugin-proposal-optional-catch-binding": "^7.0.0",
+            "@babel/plugin-proposal-optional-chaining": "^7.0.0",
+            "@babel/plugin-syntax-dynamic-import": "^7.0.0",
+            "@babel/plugin-syntax-export-default-from": "^7.0.0",
+            "@babel/plugin-syntax-flow": "^7.2.0",
+            "@babel/plugin-transform-arrow-functions": "^7.0.0",
+            "@babel/plugin-transform-block-scoping": "^7.0.0",
+            "@babel/plugin-transform-classes": "^7.0.0",
+            "@babel/plugin-transform-computed-properties": "^7.0.0",
+            "@babel/plugin-transform-destructuring": "^7.0.0",
+            "@babel/plugin-transform-exponentiation-operator": "^7.0.0",
+            "@babel/plugin-transform-flow-strip-types": "^7.0.0",
+            "@babel/plugin-transform-for-of": "^7.0.0",
+            "@babel/plugin-transform-function-name": "^7.0.0",
+            "@babel/plugin-transform-literals": "^7.0.0",
+            "@babel/plugin-transform-modules-commonjs": "^7.0.0",
+            "@babel/plugin-transform-object-assign": "^7.0.0",
+            "@babel/plugin-transform-parameters": "^7.0.0",
+            "@babel/plugin-transform-react-display-name": "^7.0.0",
+            "@babel/plugin-transform-react-jsx": "^7.0.0",
+            "@babel/plugin-transform-react-jsx-source": "^7.0.0",
+            "@babel/plugin-transform-regenerator": "^7.0.0",
+            "@babel/plugin-transform-runtime": "^7.0.0",
+            "@babel/plugin-transform-shorthand-properties": "^7.0.0",
+            "@babel/plugin-transform-spread": "^7.0.0",
+            "@babel/plugin-transform-sticky-regex": "^7.0.0",
+            "@babel/plugin-transform-template-literals": "^7.0.0",
+            "@babel/plugin-transform-typescript": "^7.0.0",
+            "@babel/plugin-transform-unicode-regex": "^7.0.0",
+            "@babel/template": "^7.0.0",
+            "react-refresh": "^0.4.0"
+          }
+        },
         "mime-db": {
           "version": "1.23.0",
           "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.23.0.tgz",
@@ -11440,9 +11637,10 @@
       }
     },
     "metro-react-native-babel-preset": {
-      "version": "0.56.4",
-      "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.56.4.tgz",
-      "integrity": "sha512-CzbBDM9Rh6w8s1fq+ZqihAh7DDqUAcfo9pPww25+N/eJ7UK436Q7JdfxwdIPpBwLFn6o6MyYn+uwL9OEWBJarA==",
+      "version": "0.59.0",
+      "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.59.0.tgz",
+      "integrity": "sha512-BoO6ncPfceIDReIH8pQ5tQptcGo5yRWQXJGVXfANbiKLq4tfgdZB1C1e2rMUJ6iypmeJU9dzl+EhPmIFKtgREg==",
+      "dev": true,
       "requires": {
         "@babel/plugin-proposal-class-properties": "^7.0.0",
         "@babel/plugin-proposal-export-default-from": "^7.0.0",
@@ -11453,6 +11651,8 @@
         "@babel/plugin-syntax-dynamic-import": "^7.0.0",
         "@babel/plugin-syntax-export-default-from": "^7.0.0",
         "@babel/plugin-syntax-flow": "^7.2.0",
+        "@babel/plugin-syntax-nullish-coalescing-operator": "^7.0.0",
+        "@babel/plugin-syntax-optional-chaining": "^7.0.0",
         "@babel/plugin-transform-arrow-functions": "^7.0.0",
         "@babel/plugin-transform-block-scoping": "^7.0.0",
         "@babel/plugin-transform-classes": "^7.0.0",
@@ -11468,6 +11668,7 @@
         "@babel/plugin-transform-parameters": "^7.0.0",
         "@babel/plugin-transform-react-display-name": "^7.0.0",
         "@babel/plugin-transform-react-jsx": "^7.0.0",
+        "@babel/plugin-transform-react-jsx-self": "^7.0.0",
         "@babel/plugin-transform-react-jsx-source": "^7.0.0",
         "@babel/plugin-transform-regenerator": "^7.0.0",
         "@babel/plugin-transform-runtime": "^7.0.0",
@@ -11475,7 +11676,7 @@
         "@babel/plugin-transform-spread": "^7.0.0",
         "@babel/plugin-transform-sticky-regex": "^7.0.0",
         "@babel/plugin-transform-template-literals": "^7.0.0",
-        "@babel/plugin-transform-typescript": "^7.0.0",
+        "@babel/plugin-transform-typescript": "^7.5.0",
         "@babel/plugin-transform-unicode-regex": "^7.0.0",
         "@babel/template": "^7.0.0",
         "react-refresh": "^0.4.0"
@@ -11491,6 +11692,50 @@
         "metro-babel-transformer": "^0.56.4",
         "metro-react-native-babel-preset": "^0.56.4",
         "metro-source-map": "^0.56.4"
+      },
+      "dependencies": {
+        "metro-react-native-babel-preset": {
+          "version": "0.56.4",
+          "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.56.4.tgz",
+          "integrity": "sha512-CzbBDM9Rh6w8s1fq+ZqihAh7DDqUAcfo9pPww25+N/eJ7UK436Q7JdfxwdIPpBwLFn6o6MyYn+uwL9OEWBJarA==",
+          "requires": {
+            "@babel/plugin-proposal-class-properties": "^7.0.0",
+            "@babel/plugin-proposal-export-default-from": "^7.0.0",
+            "@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
+            "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
+            "@babel/plugin-proposal-optional-catch-binding": "^7.0.0",
+            "@babel/plugin-proposal-optional-chaining": "^7.0.0",
+            "@babel/plugin-syntax-dynamic-import": "^7.0.0",
+            "@babel/plugin-syntax-export-default-from": "^7.0.0",
+            "@babel/plugin-syntax-flow": "^7.2.0",
+            "@babel/plugin-transform-arrow-functions": "^7.0.0",
+            "@babel/plugin-transform-block-scoping": "^7.0.0",
+            "@babel/plugin-transform-classes": "^7.0.0",
+            "@babel/plugin-transform-computed-properties": "^7.0.0",
+            "@babel/plugin-transform-destructuring": "^7.0.0",
+            "@babel/plugin-transform-exponentiation-operator": "^7.0.0",
+            "@babel/plugin-transform-flow-strip-types": "^7.0.0",
+            "@babel/plugin-transform-for-of": "^7.0.0",
+            "@babel/plugin-transform-function-name": "^7.0.0",
+            "@babel/plugin-transform-literals": "^7.0.0",
+            "@babel/plugin-transform-modules-commonjs": "^7.0.0",
+            "@babel/plugin-transform-object-assign": "^7.0.0",
+            "@babel/plugin-transform-parameters": "^7.0.0",
+            "@babel/plugin-transform-react-display-name": "^7.0.0",
+            "@babel/plugin-transform-react-jsx": "^7.0.0",
+            "@babel/plugin-transform-react-jsx-source": "^7.0.0",
+            "@babel/plugin-transform-regenerator": "^7.0.0",
+            "@babel/plugin-transform-runtime": "^7.0.0",
+            "@babel/plugin-transform-shorthand-properties": "^7.0.0",
+            "@babel/plugin-transform-spread": "^7.0.0",
+            "@babel/plugin-transform-sticky-regex": "^7.0.0",
+            "@babel/plugin-transform-template-literals": "^7.0.0",
+            "@babel/plugin-transform-typescript": "^7.0.0",
+            "@babel/plugin-transform-unicode-regex": "^7.0.0",
+            "@babel/template": "^7.0.0",
+            "react-refresh": "^0.4.0"
+          }
+        }
       }
     },
     "metro-resolver": {
@@ -12058,6 +12303,11 @@
         }
       }
     },
+    "normalize.css": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
+      "integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
+    },
     "npm-run-path": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
@@ -12630,8 +12880,7 @@
     "performance-now": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
-      "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=",
-      "dev": true
+      "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
     },
     "phin": {
       "version": "2.9.3",
@@ -12816,6 +13065,11 @@
         "ts-pnp": "^1.1.6"
       }
     },
+    "popper.js": {
+      "version": "1.16.1",
+      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
+      "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ=="
+    },
     "posix-character-classes": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@@ -13497,6 +13751,14 @@
       "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz",
       "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA=="
     },
+    "raf": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
+      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
+      "requires": {
+        "performance-now": "^2.1.0"
+      }
+    },
     "randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -14301,6 +14563,19 @@
         "prop-types": "^15.7.2"
       }
     },
+    "react-native-camera-roll-picker": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/react-native-camera-roll-picker/-/react-native-camera-roll-picker-1.2.3.tgz",
+      "integrity": "sha1-sRf9OiuQEtzM7hJhqbxCcia41tI="
+    },
+    "react-native-collapsible": {
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/react-native-collapsible/-/react-native-collapsible-1.5.2.tgz",
+      "integrity": "sha512-pmETueIStEhKY93yO/nh+G9jyMZaZta9xyUO51KP+p/tefXDtDG8Ok9QELld0Fk/kiDOldvG5Tjy+JcdS8Sdxw==",
+      "requires": {
+        "prop-types": "^15.6.2"
+      }
+    },
     "react-native-eva-icons": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/react-native-eva-icons/-/react-native-eva-icons-1.3.1.tgz",
@@ -14387,6 +14662,16 @@
         "react-native-animatable": "1.3.3"
       }
     },
+    "react-native-modal-popover": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/react-native-modal-popover/-/react-native-modal-popover-0.0.12.tgz",
+      "integrity": "sha512-uZQsTDcGOI8y/05L/Lb0OMBesJYYRWEc0pj2038a579LnDnJJpKay0kD654cQpA4Ozt3xbu4DMTGwenynBSEFg==",
+      "requires": {
+        "@types/prop-types": "^15.5.5",
+        "lodash.debounce": "^4.0.8",
+        "prop-types": "^15.6.2"
+      }
+    },
     "react-native-number-please": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/react-native-number-please/-/react-native-number-please-1.0.5.tgz",
@@ -14410,6 +14695,21 @@
       "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-0.7.3.tgz",
       "integrity": "sha512-9Uqu1vlXPi+2cKW/CW6OnHxA76mWC4kF3wvlqzq4DY8hn37AeiXtLFs2WkxH4yXQRrnJdP6ivc65Lz+MqwRZAA=="
     },
+    "react-native-safe-area-view": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.11.0.tgz",
+      "integrity": "sha512-N3nElaahu1Me2ltnfc9acpgt1znm6pi8DSadKy79kvdzKwvVIzw0IXueA/Hjr51eCW1BsfNw7D1SgBT9U6qEkA==",
+      "requires": {
+        "hoist-non-react-statics": "^2.3.1"
+      },
+      "dependencies": {
+        "hoist-non-react-statics": {
+          "version": "2.5.5",
+          "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
+          "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
+        }
+      }
+    },
     "react-native-screens": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/react-native-screens/-/react-native-screens-2.2.0.tgz",
@@ -14480,6 +14780,16 @@
         }
       }
     },
+    "react-native-swipeout": {
+      "version": "2.3.6",
+      "resolved": "https://registry.npmjs.org/react-native-swipeout/-/react-native-swipeout-2.3.6.tgz",
+      "integrity": "sha512-t9suUCspzck4vp2pWggWe0frS/QOtX6yYCawHnEes75A7dZCEE74bxX2A1bQzGH9cUMjq6xsdfC94RbiDKIkJg==",
+      "requires": {
+        "create-react-class": "^15.6.0",
+        "prop-types": "^15.5.10",
+        "react-tween-state": "^0.1.5"
+      }
+    },
     "react-native-tab-view": {
       "version": "2.14.2",
       "resolved": "https://registry.npmjs.org/react-native-tab-view/-/react-native-tab-view-2.14.2.tgz",
@@ -14537,6 +14847,15 @@
       "resolved": "https://registry.npmjs.org/react-timer-mixin/-/react-timer-mixin-0.13.4.tgz",
       "integrity": "sha512-4+ow23tp/Tv7hBM5Az5/Be/eKKF7DIvJ09voz5LyHGQaqqz9WV8YMs31eFvcYQs7d451LSg7kDJV70XYN/Ug/Q=="
     },
+    "react-tween-state": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/react-tween-state/-/react-tween-state-0.1.5.tgz",
+      "integrity": "sha1-6YsGZVHvuTy5LdG+FJlcLj3q4zk=",
+      "requires": {
+        "raf": "^3.1.0",
+        "tween-functions": "^1.0.1"
+      }
+    },
     "read-pkg": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -16453,6 +16772,11 @@
         "safe-buffer": "^5.0.1"
       }
     },
+    "tween-functions": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/tween-functions/-/tween-functions-1.2.0.tgz",
+      "integrity": "sha1-GuOlDnxguz3vd06scHrLynO7w/8="
+    },
     "tweetnacl": {
       "version": "0.14.5",
       "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
@@ -16850,6 +17174,11 @@
       "integrity": "sha1-ihagXURWV6Oupe7MWxKk+lN5dyw=",
       "dev": true
     },
+    "utility-types": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/utility-types/-/utility-types-2.1.0.tgz",
+      "integrity": "sha512-/nP2gqavggo6l38rtQI/CdeV+2fmBGXVvHgj9kV2MAnms3TIi77Mz9BtapPFI0+GZQCqqom0vACQ+VlTTaCovw=="
+    },
     "utils-merge": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
@@ -17893,6 +18222,22 @@
         "synchronous-promise": "^2.0.6",
         "toposort": "^2.0.2"
       }
+    },
+    "zarm": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/zarm/-/zarm-2.3.2.tgz",
+      "integrity": "sha512-FM/X+DOrswpjlfIbGtVxNGVlydFGuM6C9DAxnzn67EqaB/U+Fie1umUdSTM8/4VzJG4kYYfFk8etyRltfiPE8g==",
+      "requires": {
+        "better-scroll": "1.15.1",
+        "classnames": "2.2.6",
+        "color": "^3.1.0",
+        "create-react-context": "0.2.3",
+        "hoist-non-react-statics": "^3.3.0",
+        "lodash": "^4.17.15",
+        "normalize.css": "8.0.1",
+        "popper.js": "^1.15.0",
+        "react-native-camera-roll-picker": "1.2.3"
+      }
     }
   }
 }

package.json

@@ -13,6 +13,7 @@
     "preset": "jest-expo"
   },
   "dependencies": {
+    "@ant-design/react-native": "^3.3.0",
     "@babel/polyfill": "^7.8.7",
     "@eva-design/eva": "^2.0.0",
     "@expo/vector-icons": "^10.0.0",
@@ -56,7 +57,8 @@
     "react-native-tab-view": "^2.14.0",
     "react-native-textarea": "^1.0.4",
     "react-native-web": "^0.11.7",
-    "teaset": "^0.7.4"
+    "teaset": "^0.7.4",
+    "zarm": "^2.3.2"
   },
   "devDependencies": {
     "@babel/cli": "^7.10.0",
@@ -80,6 +82,7 @@
     "eslint-plugin-react-hooks": "^2.5.1",
     "eslint-plugin-react-native": "^3.8.1",
     "jest-expo": "^37.0.0",
+    "metro-react-native-babel-preset": "^0.59.0",
     "prettier": "^2.0.5",
     "react-native-svg": "11.0.1"
   },

screens/AddGoodsClassification.js

@@ -1,17 +1,9 @@
 /* eslint-disable no-underscore-dangle */
 import * as WebBrowser from "expo-web-browser";
 import * as React from "react";
-import {
-    StyleSheet,
-} from "react-native";
-import {
-    Layout,
-    Text,
-    useTheme,
-    Card,
-    List,
-} from "@ui-kitten/components";
-import { useFocusEffect } from "@react-navigation/native";
+import { StyleSheet } from "react-native";
+import { Layout, Text, useTheme, Card, List } from "@ui-kitten/components";
+import { useFocusEffect, useRoute } from "@react-navigation/native";
 // import ActionButton from "react-native-action-button";
 import { useModel } from "flooks";
 import ScrollPage from "../components/ScrollPage";
@@ -20,303 +12,306 @@ import GoodsCard from "../components/GoodsCard";
 import EmptyComponent from "../components/EmptyComponent";
 
 const Header = (props, title) => (
-  <Text {...props} category='s1'>
+  <Text {...props} category="s1">
     {title}
   </Text>
 );
 
 const styles = StyleSheet.create({
-    flex1: {
-        backgroundColor: "rgba(0,0,0,0)",
-        paddingHorizontal: 15,
-        paddingBottom: 20,
-    },
-    list: {
-        backgroundColor: "rgba(0,0,0,0)",
-    },
-    container: {
-        backgroundColor: "#EEEEEE",
-        paddingTop: 20,
-    },
-    tabContent: {
-        backgroundColor: "#fff",
-        marginTop: 20,
-    },
-    img: {
-        width: 100,
-        height: 100,
-        alignSelf: "center",
-    },
-    img2: {
-        width: 97,
-        height: 21,
-        alignSelf: "center",
-        marginTop: 2,
-    },
-    text: {
-        marginTop: 16,
-    },
-    layoutLeft: {
-        // flexDirection: "row",
-        paddingVertical: 10,
-        justifyContent: "center",
-        alignItems: "center",
-    },
-    form: {
-        paddingHorizontal: 26,
-        paddingVertical: 20,
-    },
-    textareaContainer: {
-        backgroundColor: "#F0F0F0",
-        height: 100,
-        borderRadius: 4,
-    },
-    textarea: {
-        textAlignVertical: "top", // hack android
-        fontSize: 13,
-        color: "#333",
-        paddingHorizontal: 14,
-        paddingVertical: 10,
-        height: 100,
-    },
+  flex1: {
+    backgroundColor: "rgba(0,0,0,0)",
+    paddingHorizontal: 15,
+    paddingBottom: 20,
+  },
+  list: {
+    backgroundColor: "rgba(0,0,0,0)",
+  },
+  container: {
+    backgroundColor: "#EEEEEE",
+    paddingTop: 20,
+  },
+  tabContent: {
+    backgroundColor: "#fff",
+    marginTop: 20,
+  },
+  img: {
+    width: 100,
+    height: 100,
+    alignSelf: "center",
+  },
+  img2: {
+    width: 97,
+    height: 21,
+    alignSelf: "center",
+    marginTop: 2,
+  },
+  text: {
+    marginTop: 16,
+  },
+  layoutLeft: {
+    // flexDirection: "row",
+    paddingVertical: 10,
+    justifyContent: "center",
+    alignItems: "center",
+  },
+  form: {
+    paddingHorizontal: 26,
+    paddingVertical: 20,
+  },
+  textareaContainer: {
+    backgroundColor: "#F0F0F0",
+    height: 100,
+    borderRadius: 4,
+  },
+  textarea: {
+    textAlignVertical: "top", // hack android
+    fontSize: 13,
+    color: "#333",
+    paddingHorizontal: 14,
+    paddingVertical: 10,
+    height: 100,
+  },
 });
 
+export default function AddGoodsClassification({}) {
+  const theme = useTheme();
+  const { changeBackground } = useModel("barModel");
+  const { httpGet, httpPost } = useModel("httpModel", true);
+  const { success } = useModel("loadingModel", true);
 
-export default function AddGoodsClassification({  route }) {
-    const theme = useTheme();
-    const { changeBackground } = useModel("barModel");
-    const { httpGet, httpPost } = useModel("httpModel", true);
-    const { success } = useModel("loadingModel", true);
+  const {
+    goodsClassificationTitle1,
+    goodsClassificationTitle2,
+    goodsClassificationTitle3,
+    add,
+    remove,
+    successText,
+    removeTips,
+    addClassTips,
+  } = useModel("wordsModel");
+  const { showDialog } = useModel("dialogModel", true);
+  const { selectInfos, changeSelect } = useModel("goodsModel");
+  const [goods, changeGoods] = React.useState([]);
+  const [selectId, changeSelectId] = React.useState(0);
+  const [goodsClass, setGoodsClass] = React.useState([]);
+  const [pageType, changeType] = React.useState();
 
-    const {
-        goodsClassificationTitle1,
-        goodsClassificationTitle2,
-        goodsClassificationTitle3,
-        add,
-        remove,
-        successText,
-        removeTips,
-        addClassTips,
-    } = useModel("wordsModel");
-    const { showDialog } = useModel("dialogModel", true);
-    const { selectInfos, changeSelect } = useModel("goodsModel");
-    const [goods, changeGoods] = React.useState([]);
-    const [selectId, changeSelectId] = React.useState(0);
-    const [goodsClass, setGoodsClass] = React.useState([]);
-	const [pageType, changeType] = React.useState("signboard");
+  const topGoods = React.useMemo(() => {
+    if (pageType === "signboard") {
+      return goods.filter(item => {
+        return item.signboard;
+      });
+    }
+
+    if (pageType === "recommend") {
+      return goods.filter(item => {
+        return item.recommend;
+      });
+    }
+
+    return [...goodsClass];
+  }, [goods, goodsClass]);
 
+  const elseGoods = React.useMemo(() => {
+    if (pageType === "signboard") {
+      return goods.filter(item => {
+        return !item.signboard;
+      });
+    }
 
-	const topGoods = React.useMemo(() => {
-        if (pageType === "signboard") {
-            return goods.filter(item => {
-                return item.signboard;
-            });
-        } 
-            return [...goodsClass];
-        
-    }, [goods, goodsClass]);
+    if (pageType === "recommend") {
+      return goods.filter(item => {
+        return !item.recommend;
+      });
+    }
+    const _topIds = topGoods.map(item => {
+      return item.id;
+    });
+    return goods.filter(item => {
+      return _topIds.indexOf(item.id) === -1;
+    });
+  }, [goods, goodsClass]);
 
-    const elseGoods = React.useMemo(() => {
-        if (pageType === "signboard") {
-            return goods.filter(item => {
-                return !item.signboard;
-            });
-        } 
-            const _topIds = topGoods.map(item => {
-                return item.id;
-            });
-            return goods.filter(item => {
-                return _topIds.indexOf(item.id) === -1;
-            });
-        
-    }, [goods, goodsClass]);
+  function getSelectGoods() {
+    httpGet("/classification/allGoods", {
+      classificationId: selectId,
+    }).then(res => {
+      let list = res || [];
+      list = list.filter(item => {
+        return item != null;
+      });
+      setGoodsClass(list);
+    });
+  }
 
+  function getAllGoods() {
+    httpGet("/goods/my").then(res => {
+      changeGoods(res);
+    });
+  }
 
-	
-	function getSelectGoods() {
-        httpGet("/classification/allGoods", {
-            classificationId: selectId,
-        }).then(res => {
-            let list = res || [];
-            list = list.filter(item => {
-                return item != null;
-            });
-            setGoodsClass(list);
+  function changeSignboard(id, signboard, tips, info) {
+    if (pageType === "signboard" || pageType === "recommend") {
+      httpPost(
+        "/goods/save",
+        {
+          id,
+          [pageType]: signboard,
+        },
+        { body: "json" }
+      ).then(res => {
+        success(tips + successText);
+        const _goods = goods.map(item => {
+          if (item.id !== id) {
+            return item;
+          }
+          return res;
         });
-	}
-	
-	function getAllGoods() {
-        httpGet("/goods/my").then(res => {
-            changeGoods(res);
-        });
-	}
-	
-	function changeSignboard(id, signboard, tips, info) {
-        if (pageType === "signboard") {
-            httpPost(
-                "/goods/save",
-                {
-                    id,
-                    signboard,
-                },
-                { body: "json" }
-            ).then(res => {
-                success(tips + successText);
-                const _goods = goods.map(item => {
-                    if (item.id !== id) {
-                        return item;
-                    } 
-                        return res;
-                    
-                });
-                changeGoods(_goods);
-            });
-        } else if (pageType === "classification" && selectId === "new") {
-            const _goodsClass = [...goodsClass];
-            if (signboard) {
-                _goodsClass.push(info);
-            } else {
-                _goodsClass.splice(
-                    _goodsClass.findIndex(item => {
-                        return item.id === id;
-                    }),
-                    1
-                );
-            }
-            success(tips + successText);
-            setGoodsClass(_goodsClass);
-            changeSelect(_goodsClass);
-        } else if (signboard) {
-                const ids = topGoods.map(item => {
-                    return item.id;
-                });
-                ids.push(id);
-                httpGet(
-                    "/classification/saveGoods",
-                    {
-                        classificationId: selectId,
-                        string: ids.join(","),
-                    },
-                    { body: "json" }
-                ).then(() => {
-                    success(tips + successText);
-                    getSelectGoods();
-                });
-            } else {
-                httpGet(
-                    "/classification/delGoods",
-                    {
-                        classificationId: selectId,
-                        goodId: id,
-                    },
-                    { body: "json" }
-                ).then(() => {
-                    success(tips + successText);
-                    getSelectGoods();
-                });
-            }
+        changeGoods(_goods);
+      });
+    } else if (pageType === "classification" && selectId === "new") {
+      const _goodsClass = [...goodsClass];
+      if (signboard) {
+        _goodsClass.push(info);
+      } else {
+        _goodsClass.splice(
+          _goodsClass.findIndex(item => {
+            return item.id === id;
+          }),
+          1
+        );
+      }
+      success(tips + successText);
+      setGoodsClass(_goodsClass);
+      changeSelect(_goodsClass);
+    } else if (signboard) {
+      const ids = topGoods.map(item => {
+        return item.id;
+      });
+      ids.push(id);
+      httpGet(
+        "/classification/saveGoods",
+        {
+          classificationId: selectId,
+          string: ids.join(","),
+        },
+        { body: "json" }
+      ).then(() => {
+        success(tips + successText);
+        getSelectGoods();
+      });
+    } else {
+      httpGet(
+        "/classification/delGoods",
+        {
+          classificationId: selectId,
+          goodId: id,
+        },
+        { body: "json" }
+      ).then(() => {
+        success(tips + successText);
+        getSelectGoods();
+      });
     }
+  }
 
+  const route = useRoute();
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
+      const { params } = route;
+      const { type, classificationId } = params;
+      if (type === "classification") {
+        changeSelectId(classificationId);
+      }
+      if (type) {
+        changeType(type);
+      } else {
+        changeType("signboard");
+      }
 
+      getAllGoods();
+    }, [])
+  );
 
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-            if (route.params.type === "classification") {
-                changeSelectId(route.params.classificationId);
-            }
-            if (route.params.type) {
-                changeType(route.params.type);
-            } else {
-                changeType("signboard");
-            }
-
-            getAllGoods();
-        }, [])
-    );
+  React.useEffect(() => {
+    if (selectId && selectId !== "new") {
+      getSelectGoods();
+    } else if (selectId === "new") {
+      setGoodsClass(selectInfos);
+    }
+  }, [selectId]);
 
-    React.useEffect(() => {
-        if (selectId && selectId !== "new") {
-            getSelectGoods();
-        } else if (selectId === "new") {
-            setGoodsClass(selectInfos);
+  const chooseGoodsItem = ({ item }) => (
+    <GoodsCard
+      info={item}
+      key={item.id}
+      isAdd
+      removeEvent={() => {
+        showDialog({
+          bodyText: removeTips,
+          status: "danger",
+          cancelable: true,
+          confirmCallback: () => {
+            changeSignboard(item.id, false, remove, item);
+          },
+        });
+      }}
+    />
+  );
+  const goodsItem = ({ item }) => (
+    <GoodsCard
+      info={item}
+      key={item.id}
+      isAdd={false}
+      addEvent={() => {
+        if (topGoods.length < 2 || pageType !== "recommend") {
+          changeSignboard(item.id, true, add, item);
+        } else {
+          showDialog({
+            bodyText: addClassTips,
+          });
         }
-    }, [selectId]);
+      }}
+    />
+  );
 
-   
-
-  
-    const chooseGoodsItem = ({ item }) => (
-      <GoodsCard
-        info={item}
-        key={item.id}
-        isAdd
-        removeEvent={() => {
-                showDialog({
-                    bodyText: removeTips,
-                    status: "danger",
-                    cancelable: true,
-                    confirmCallback: () => {
-                        changeSignboard(item.id, false, remove, item);
-                    },
-                });
-            }}
-      />
-    );
-    const goodsItem = ({ item }) => (
-      <GoodsCard
-        info={item}
-        key={item.id}
-        isAdd={false}
-        addEvent={() => {
-                if (topGoods.length < 2 || pageType !== "signboard") {
-                    changeSignboard(item.id, true, add, item);
-                } else {
-                    showDialog({
-                        bodyText: addClassTips,
-                    });
-                }
+  return (
+    <>
+      <NavHeaderBar title={goodsClassificationTitle1} />
+      <ScrollPage>
+        <Layout style={styles.container}>
+          <Card
+            appearance="headerList"
+            header={props => {
+              return Header(props, goodsClassificationTitle2);
             }}
-      />
-    );
+            disabled
+          >
+            <List
+              data={topGoods}
+              style={styles.list}
+              renderItem={chooseGoodsItem}
+              ListEmptyComponent={EmptyComponent}
+            />
+          </Card>
 
-   
-    return (
-      <>
-        <NavHeaderBar title={goodsClassificationTitle1} />
-        <ScrollPage>
-          <Layout style={styles.container}>
-            <Card
-              appearance='headerList'
-              header={props => {
-                            return Header(props, goodsClassificationTitle2);
-                        }}
-              disabled
-            >
-              <List
-                data={topGoods}
-                style={styles.list}
-                renderItem={chooseGoodsItem}
-                ListEmptyComponent={EmptyComponent}
-              />
-            </Card>
-
-            <Card
-              appearance='headerList'
-              header={props => {
-                            return Header(props, goodsClassificationTitle3);
-                        }}
-              disabled
-            >
-              <List
-                data={elseGoods}
-                style={styles.list}
-                renderItem={goodsItem}
-                ListEmptyComponent={EmptyComponent}
-              />
-            </Card>
-          </Layout>
-          {/* <ActionButton
+          <Card
+            appearance="headerList"
+            header={props => {
+              return Header(props, goodsClassificationTitle3);
+            }}
+            disabled
+          >
+            <List
+              data={elseGoods}
+              style={styles.list}
+              renderItem={goodsItem}
+              ListEmptyComponent={EmptyComponent}
+            />
+          </Card>
+        </Layout>
+        {/* <ActionButton
                     style={{ zIndex: 2 }}
                     buttonColor={theme["color-primary-500"]}
                     onPress={() => {
@@ -331,8 +326,7 @@ export default function AddGoodsClassification({  route }) {
                     }}
                     position='center'
                 /> */}
-        </ScrollPage>
-      </>
-    );
+      </ScrollPage>
+    </>
+  );
 }
-

screens/Bank/MoneyListScreen.js

@@ -143,7 +143,7 @@ export default function MoneyListScreen({ navigation }) {
         const type = data[selectedIndex.row].type || "";
         return moneyRecordList(page, size, { type }).then(res => {
             changeStart(false);
-            return Promise.reslove(res);
+			return Promise.resolve(res);
         });
     }
     const renderBackAction = () => (

screens/Coupon/AddScreen.js

@@ -5,184 +5,165 @@ import * as React from "react";
 import { StyleSheet } from "react-native";
 import { useModel } from "flooks";
 import { useFocusEffect } from "@react-navigation/native";
-import {
-    Layout,
-    Button,
-    useTheme,
-    Divider,
-} from "@ui-kitten/components";
+import { Layout, Button, useTheme, Divider } from "@ui-kitten/components";
 import NavHeaderBar from "../../components/NavHeaderBar";
 import FormInput from "../../components/FormInput";
 
-
 const styles = StyleSheet.create({
-    form: {
-        paddingHorizontal: 10,
-        flex: 1,
-        marginTop: 10,
-    },
-    radio: {
-        paddingVertical: 15,
-        paddingHorizontal: 15,
-    },
-    btn: {
-        marginHorizontal: 15,
-        marginVertical: 10,
-    },
-    btnList: {
-        alignItems: "center",
-    },
-    label: {
-        width: 105,
-    },
+  form: {
+    paddingHorizontal: 10,
+    flex: 1,
+    marginTop: 10,
+  },
+  radio: {
+    paddingVertical: 15,
+    paddingHorizontal: 15,
+  },
+  btn: {
+    marginHorizontal: 15,
+    marginVertical: 10,
+  },
+  btnList: {
+    alignItems: "center",
+  },
+  label: {
+    width: 105,
+  },
 });
 
 export default function CouponAddScreen({ navigation, route }) {
-    const theme = useTheme();
-    const { changeBackground } = useModel("barModel");
-
-    const [id, setId] = React.useState();
-    const { defaultStartTime, defaultEndTime, saveInfo, removeInfo } = useModel(
-        "couponModel"
-    );
-    const [name, changeName] = React.useState("");
-    const [amount, changeAmount] = React.useState("");
-    const [fullAmount, changeFullAmount] = React.useState("");
-    const [startDate, changeStartDate] = React.useState("");
-    const [endDate, changeEndDate] = React.useState("");
-
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-            const { params } = route;
-            const { id, pageName } = params || {};
-            if (id) {
-                setId(id);
-            } else {
-                changeEndDate(defaultEndTime);
-                changeStartDate(defaultStartTime);
-            }
-        }, [])
-    );
-
-    React.useEffect(() => {
-        if (id) {
-            // httpGet("/bankCard/get/" + id, {}, true).then(res => {
-            //     function getVal(value) {
-            //         return value || "";
-            //     }
-            //     changeName(getVal(res.name));
-            //     changeAmount(getVal(res.amount));
-            //     changeFullAmount(getVal(res.fullAmount));
-            //     changeIdNo(getVal(res.idNo));
-            //     changePhone(getVal(res.phone));
-            //     // changeCode(getVal(res.code));
-            // });
-        }
-    }, [id]);
-
-    const canNext = React.useMemo(() => {
-        if (name && amount && startDate && endDate) {
-            return true;
-        } 
-            return false;
-        
-    }, [name, amount, fullAmount, id, startDate, endDate]);
-
-    const submit = () => {
-        saveInfo({ id, name, amount, fullAmount, startDate, endDate }).then(
-            res => {
-                navigation.goBack();
-            }
-        );
-    };
-
-    const remove = () => {
-        removeInfo(id).then(res => {
-            navigation.goBack();
-        });
-    };
-
-    return (
-      <>
-        <NavHeaderBar title='编辑（新增）优惠券' />
-
-        <Layout style={styles.form}>
-          {/* 优惠券名称 */}
-          <FormInput
-            label='优惠券名称'
-            labelStyle={styles.label}
-            key={1}
-            placeholder='输入优惠券名称'
-            value={name}
-            onChange={changeName}
-          />
-          {/* 优惠券金额 */}
-          <FormInput
-            label='优惠券金额'
-            labelStyle={styles.label}
-            key={2}
-            placeholder='输入金额'
-            type='money'
-            value={amount}
-            onChange={changeAmount}
-          />
-
-          <Divider />
-          {/* 优惠券门槛金额 */}
-          <FormInput
-            label='优惠券门槛金额'
-            labelStyle={styles.label}
-            key={3}
-            placeholder='输入门槛金额'
-            type='money'
-            value={fullAmount}
-            onChange={changeFullAmount}
-          />
-
-          {/* 优惠券开始时间 */}
-          <FormInput
-            label='优惠券开始时间'
-            labelStyle={styles.label}
-            key={4}
-            placeholder=''
-            type='date'
-            value={startDate}
-            onChange={changeStartDate}
-          />
-
-          {/* 优惠券结束时间 */}
-          <FormInput
-            label='优惠券结束时间'
-            labelStyle={styles.label}
-            key={5}
-            placeholder=''
-            type='date'
-            value={endDate}
-            onChange={changeEndDate}
-          />
-
-          <Layout style={styles.btnList}>
-            <Button
-              style={styles.btn}
-              disabled={!canNext}
-              onPress={submit}
-            >
-              确定
-            </Button>
-            {id != null && (
-            <Button
-              appearance='ghost'
-              status='info'
-              onPress={remove}
-            >
+  const theme = useTheme();
+  const { changeBackground } = useModel("barModel");
+
+  const [id, setId] = React.useState();
+  const {
+    defaultStartTime,
+    defaultEndTime,
+    saveInfo,
+    removeInfo,
+    getInfo,
+  } = useModel("couponModel");
+  const [name, changeName] = React.useState("");
+  const [amount, changeAmount] = React.useState("");
+  const [fullAmount, changeFullAmount] = React.useState("");
+  const [startDate, changeStartDate] = React.useState("");
+  const [endDate, changeEndDate] = React.useState("");
+
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
+      const { params } = route;
+      const { id, pageName } = params || {};
+      if (id) {
+        setId(id);
+      } else {
+        changeEndDate(defaultEndTime);
+        changeStartDate(defaultStartTime);
+      }
+    }, [])
+  );
+
+  React.useEffect(() => {
+    if (id) {
+      getInfo(id).then(res => {
+        changeName(res.name);
+        changeAmount(res.amount.toString());
+        changeFullAmount(res.fullAmount.toString());
+        changeStartDate(res.startDate);
+        changeEndDate(res.endDate);
+      });
+    }
+  }, [id]);
+
+  const canNext = React.useMemo(() => {
+    if (name && amount && startDate && endDate) {
+      return true;
+    }
+    return false;
+  }, [name, amount, fullAmount, id, startDate, endDate]);
+
+  const submit = () => {
+    saveInfo({ id, name, amount, fullAmount, startDate, endDate }).then(res => {
+      navigation.goBack();
+    });
+  };
+
+  const remove = () => {
+    removeInfo(id).then(res => {
+      navigation.goBack();
+    });
+  };
+
+  return (
+    <>
+      <NavHeaderBar title="编辑（新增）优惠券" />
+
+      <Layout style={styles.form}>
+        {/* 优惠券名称 */}
+        <FormInput
+          label="优惠券名称"
+          labelStyle={styles.label}
+          key={1}
+          placeholder="输入优惠券名称"
+          value={name}
+          onChange={changeName}
+        />
+        {/* 优惠券金额 */}
+        <FormInput
+          label="优惠券金额"
+          labelStyle={styles.label}
+          key={2}
+          placeholder="输入金额"
+          type="money"
+          value={amount}
+          onChange={changeAmount}
+        />
+
+        <Divider />
+        {/* 优惠券门槛金额 */}
+        <FormInput
+          label="优惠券门槛金额"
+          labelStyle={styles.label}
+          key={3}
+          placeholder="输入门槛金额"
+          type="money"
+          value={fullAmount}
+          onChange={changeFullAmount}
+        />
+
+        {/* 优惠券开始时间 */}
+        <FormInput
+          label="优惠券开始时间"
+          labelStyle={styles.label}
+          key={4}
+          placeholder=""
+          type="date"
+          value={startDate}
+          onChange={changeStartDate}
+        />
+
+        {/* 优惠券结束时间 */}
+        <FormInput
+          label="优惠券结束时间"
+          labelStyle={styles.label}
+          key={5}
+          placeholder=""
+          type="date"
+          value={endDate}
+          onChange={changeEndDate}
+        />
+
+        <Layout style={styles.btnList}>
+          <Button style={styles.btn} disabled={!canNext} onPress={submit}>
+            确定
+          </Button>
+          {id != null && (
+            <Button appearance="ghost" status="info" onPress={remove}>
               删除
             </Button>
-                    )}
-          </Layout>
+          )}
         </Layout>
-      </>
-    );
+      </Layout>
+    </>
+  );
 }
-
-

screens/Coupon/index.js

@@ -4,12 +4,12 @@ import listScreen from "./listScreen";
 import CouponAddScreen from "./AddScreen";
 
 export default function Set(Screen) {
-    return (
-      <>
-        {/* 优惠券列表 */}
-        <Screen name='CouponList' component={listScreen} />
-        {/* 新增优惠券 */}
-        <Screen name='CouponAdd' component={CouponAddScreen} />
-      </>
-    );
+  return (
+    <>
+      {/* 优惠券列表 */}
+      <Screen name="CouponList" component={listScreen} />
+      {/* 新增优惠券 */}
+      <Screen name="CouponAdd" component={CouponAddScreen} />
+    </>
+  );
 }

screens/Coupon/listScreen.js

@@ -1,73 +1,90 @@
 import * as WebBrowser from "expo-web-browser";
 import * as React from "react";
-import {
-    StyleSheet,
-    View,
-} from "react-native";
+import { StyleSheet, View } from "react-native";
 import { useModel } from "flooks";
-import {
-    useTheme,
-    Button,
-} from "@ui-kitten/components";
+import { useTheme, Button } from "@ui-kitten/components";
 import { useFocusEffect } from "@react-navigation/native";
 import NavHeaderBar from "../../components/NavHeaderBar";
 import Coupon from "../../components/Coupon";
 
 import ListComponent from "../../components/ListComponent";
 
-
 const styles = StyleSheet.create({
-    top: {
-        alignItems: "center",
-        paddingVertical: 10,
-        marginBottom: 10,
-    },
-    list: {
-        flex: 1,
-        backgroundColor: "rgb(242, 242, 242)",
-        paddingHorizontal: 15,
-    },
-    separatorStyle: {
-        marginHorizontal: 13,
-    },
+  top: {
+    alignItems: "center",
+    paddingVertical: 10,
+    marginBottom: 10,
+  },
+  list: {
+    flex: 1,
+    backgroundColor: "rgb(242, 242, 242)",
+    paddingHorizontal: 15,
+  },
+  separatorStyle: {
+    marginHorizontal: 13,
+  },
 });
 
-
 export default function CouponListScreen({ navigation }) {
-    const theme = useTheme();
-    const { changeBackground } = useModel("barModel");
-    // const {} = useModel("wordsModel");
-    const { getMyList } = useModel("couponModel");
+  const theme = useTheme();
+  const { changeBackground } = useModel("barModel");
+  // const {} = useModel("wordsModel");
+  const { getMyList, delCoupon } = useModel("couponModel");
+  const [startState, changeStart] = React.useState(false);
 
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-        }, [])
-    );
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
 
-    const walletItem = ({ item, index }) => <Coupon key={index} info={item} />;
+      changeStart(true);
+    }, [])
+  );
 
-    return (
-      <>
-        <NavHeaderBar title='优惠券管理' />
-        <View style={styles.top}>
-          <Button
-            appearance='outline'
-            onPress={() => {
-                        navigation.navigate("CouponAdd");
-                    }}
-          >
-            新增优惠券
-          </Button>
-        </View>
-        <ListComponent
-          getInfo={getMyList}
-          renderItem={walletItem}
-          style={styles.list}
-          separatorStyle={styles.separatorStyle}
-          showEmpty
-        />
-      </>
-    );
-}
+  function getList(page, size) {
+    return getMyList(page, size).then(res => {
+      changeStart(false);
+      return Promise.resolve(res);
+    });
+  }
 
+  const walletItem = ({ item, index }) => (
+    <Coupon
+      key={index}
+      info={item}
+      delEvent={() => {
+        delCoupon(item.id, () => {
+          changeStart(true);
+        });
+      }}
+      onPress={() => {
+        navigation.navigate("CouponAdd", {
+          id: item.id,
+        });
+      }}
+    />
+  );
+
+  return (
+    <>
+      <NavHeaderBar title="优惠券管理" />
+      <View style={styles.top}>
+        <Button
+          appearance="outline"
+          onPress={() => {
+            navigation.navigate("CouponAdd");
+          }}
+        >
+          新增优惠券
+        </Button>
+      </View>
+      <ListComponent
+        getInfo={getList}
+        renderItem={walletItem}
+        style={styles.list}
+        separatorStyle={styles.separatorStyle}
+        showEmpty
+        startState={startState}
+      />
+    </>
+  );
+}

screens/Goods/SearchScreen.js

@@ -1,101 +1,121 @@
+/* eslint-disable no-console */
 /* eslint-disable no-underscore-dangle */
 import * as WebBrowser from "expo-web-browser";
 import * as React from "react";
-import {
-    StyleSheet,
-} from "react-native";
+import { StyleSheet } from "react-native";
 import { useModel } from "flooks";
-import {
-    Layout,
-    useTheme,
-    List,
-} from "@ui-kitten/components";
+import { Layout, useTheme } from "@ui-kitten/components";
+import { SearchBar } from "@ant-design/react-native";
 import { useFocusEffect } from "@react-navigation/native";
 import NavHeaderBar from "../../components/NavHeaderBar";
 import GoodsCardLarge from "../../components/GoodsCard";
-import EmptyComponent from "../../components/EmptyComponent";
-
-
+import ListComponent from "../../components/ListComponent";
 
 const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-    },
-    bntLay: {
-        paddingVertical: 5,
-        flexDirection: "row",
-        alignItems: "center",
-        justifyContent: "center",
-        backgroundColor: "#EEEEEE",
-        flexShrink: 0,
-    },
-    list: {
-        flex: 1,
-        backgroundColor: "#EEEEEE",
-        paddingTop: 10,
-        paddingHorizontal: 15,
-    },
+  container: {
+    flex: 1,
+  },
+  bntLay: {
+    paddingVertical: 5,
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: "#EEEEEE",
+    flexShrink: 0,
+  },
+  list: {
+    flex: 1,
+    backgroundColor: "#EEEEEE",
+    paddingHorizontal: 10,
+  },
 });
 
-
 export default function SearchScreen({ navigation }) {
-    const theme = useTheme();
-    const { changeBackground } = useModel("barModel");
-    // const { } = useModel("userModel");
-    const { httpGet } = useModel("httpModel");
-    const [goods, changeGoods] = React.useState("");
-    const {
-        userTitle3,
-    } = useModel("wordsModel");
-	function getAllGoods() {
-        httpGet("/goods/my").then(res => {
-            changeGoods(res);
-        });
-    }
+  const theme = useTheme();
+  const { changeBackground } = useModel("barModel");
+  const { mid } = useModel("userModel");
+  const { httpGet } = useModel("httpModel");
+//   const { userTitle3 } = useModel("wordsModel");
+  const [startState, changeStart] = React.useState(false);
+  const [searchKey, setSearchKey] = React.useState("");
+  const [inputVal, setVal] = React.useState("");
+
+  function getAllGoods(page, size) {
+    return httpGet("/goods/all", {
+      size,
+      page,
+      search: searchKey,
+      query: {
+        merchantId: mid,
+      },
+      sort: "id,desc",
+    }).then(res => {
+      changeStart(false);
+      return Promise.resolve(res);
+    });
+  }
 
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-            getAllGoods();
-        }, [])
-    );
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
+      //   changeStart(true);
+    }, [])
+  );
 
- 
-    const goodsItem = ({ item, index }) => (
-      <GoodsCardLarge
-        appearance='classification'
-        type='goodsList'
-        key={item.id}
-        info={item}
-        canEdit
-        style={{ marginBottom: 7 }}
-        onPress={() => {
-                navigation.navigate("AddGoods", {
-                    id: item.id,
-                });
-            }}
-        changeInfo={info => {
-                const _goods = [...goods];
-                _goods.splice(index, 1, info);
-                changeGoods(_goods);
-            }}
-      />
-    );
+  const goodsItem = ({ item }) => (
+    <GoodsCardLarge
+      appearance="classification"
+      type="goodsList"
+      key={item.id}
+      info={item}
+      canEdit
+      style={{ marginBottom: 7 }}
+      onPress={() => {
+        navigation.navigate("AddGoods", {
+          id: item.id,
+        });
+      }}
+      changeInfo={info => {
+        // eslint-disable-next-line no-console
+        console.log(info);
+        changeStart(true);
+      }}
+    />
+  );
 
-    return (
-      <>
-        <NavHeaderBar title={userTitle3} />
-        <Layout style={styles.container}>
-          <Layout style={styles.bntLay}>
-            {/* <Input /> */}
-          </Layout>
-          <List
-            style={styles.list}
-            data={goods}
-            renderItem={goodsItem}
-            ListEmptyComponent={EmptyComponent}
-          />
-        </Layout>
-      </>
-    );
+  return (
+    <>
+      <NavHeaderBar title="店铺商品搜索" />
+      <Layout style={styles.container}>
+        <SearchBar
+          placeholder="请输入商品名称"
+          value={inputVal}
+          onChange={setVal}
+          onSubmit={value => {
+            setSearchKey(value);
+            changeStart(true);
+          }}
+          onCancel={() => {
+            if (inputVal) {
+              setVal("");
+              setSearchKey("");
+              changeStart(true);
+            } else {
+              navigation.goBack();
+            }
+          }}
+          cancelText={inputVal ? "取消" : "返回"}
+          showCancelButton
+        />
+        <ListComponent
+          startState={startState}
+          renderItem={goodsItem}
+          getInfo={getAllGoods}
+          showEmpty
+          style={styles.list}
+          saveList
+        />
+      </Layout>
+    </>
+  );
 }

screens/Goods/index.js

@@ -3,11 +3,11 @@ import * as React from "react";
 import SearchScreen from "./SearchScreen";
 import GoodsSpecificationScreen from "./GoodsSpecificationScreen";
 
-export default function Set(Screen) {
+export default function GoodsConfig(Screen) {
     return (
       <>
         {/* 搜索 */}
-        <Screen name='SearchScreen' component={SearchScreen} />
+        <Screen name='Search' component={SearchScreen} />
         {/* 商品规格 */}
         <Screen
           name='GoodsSpecification'

screens/HomeScreen.js

@@ -1,25 +1,26 @@
 import * as WebBrowser from "expo-web-browser";
 import * as React from "react";
 import {
-    Image,
-    StyleSheet,
-    TouchableOpacity,
-    ImageBackground,
-    ScrollView,
+  Image,
+  StyleSheet,
+  TouchableOpacity,
+  ImageBackground,
+  ScrollView,
 } from "react-native";
 import { useModel } from "flooks";
 import {
-    Layout,
-    Text,
-    useTheme,
-    Button,
-    Card,
-    Icon,
-    MenuItem,
-    OverflowMenu,
-    TopNavigation,
-	TopNavigationAction
+  Layout,
+  Text,
+  useTheme,
+  Button,
+  Card,
+  Icon,
+  MenuItem,
+  OverflowMenu,
+  TopNavigation,
+  TopNavigationAction,
 } from "@ui-kitten/components";
+import { NoticeBar } from "@ant-design/react-native";
 import { createMaterialTopTabNavigator } from "@react-navigation/material-top-tabs";
 import { useFocusEffect } from "@react-navigation/native";
 import Badge from "../components/Badge";
@@ -29,380 +30,396 @@ import HomePage3 from "./HomeScreenPage3";
 import * as RootNavigation from "../navigation/RootNavigation";
 
 const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-        backgroundColor: "#F0F0F0",
-    },
-    touch: {
-        width: 53,
-        height: 53,
-        position: "absolute",
-        left: 10,
-        top: 10,
-        zIndex: 2,
-    },
-    icon: {
-        width: 53,
-        height: 53,
-        backgroundColor: "#E5E5E5",
-        borderRadius: 3,
-    },
-    text: {
-        fontWeight: "500",
-        marginBottom: 7,
-    },
-    button: {
-        marginTop: 19,
-    },
-    banner: {
-        height: 100,
-        backgroundColor: "#E5E5E5",
-    },
-    FlexRow: {
-        flexDirection: "row",
-        alignItems: "center",
-        marginTop: 2,
-    },
-    zanImg: {
-        width: 12,
-        height: 12,
-        marginRight: 3,
-    },
-    layItem: {
-        width: 40,
-        marginRight: 10,
-    },
-    cardMain: {
-        alignItems: "center",
-        zIndex: 1,
-    },
-    cardTop: {
-        height: 53,
-        alignItems: "center",
-        justifyContent: "center",
-    },
-    badges: {
-        flexDirection: "row",
-        justifyContent: "center",
-    },
-    badge: {
-        marginRight: 15,
-    },
-    labelText: {
-        textAlign: "left",
-        fontSize: 13,
-        paddingHorizontal: 10,
-        minWidth: 120,
-    },
-    homeCard: {
-        position: "absolute",
-        left: 13,
-        top: 66,
-        right: 13,
-        zIndex: 2,
-    },
-    mainContent: {
-        marginTop: 100,
-        backgroundColor: "transparent",
-    },
-    tab: {
-        backgroundColor: "#eee",
-    },
-    tabContainer: {
-        backgroundColor: "transparent",
-    },
-    tabIndicator: {
-        backgroundColor: "#FFC21C",
-    },
+  container: {
+    flex: 1,
+    backgroundColor: "#F0F0F0",
+  },
+  touch: {
+    width: 53,
+    height: 53,
+    position: "absolute",
+    left: 10,
+    top: 10,
+    zIndex: 2,
+  },
+  icon: {
+    width: 53,
+    height: 53,
+    backgroundColor: "#E5E5E5",
+    borderRadius: 3,
+  },
+  text: {
+    fontWeight: "500",
+    marginBottom: 7,
+  },
+  button: {
+    marginTop: 19,
+  },
+  banner: {
+    height: 100,
+    backgroundColor: "#E5E5E5",
+  },
+  FlexRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    marginTop: 2,
+  },
+  zanImg: {
+    width: 12,
+    height: 12,
+    marginRight: 3,
+  },
+  layItem: {
+    width: 40,
+    marginRight: 10,
+  },
+  cardMain: {
+    alignItems: "center",
+    zIndex: 1,
+  },
+  cardTop: {
+    minHeight: 53,
+    alignItems: "center",
+    justifyContent: "center",
+    paddingBottom: 10,
+  },
+  badges: {
+    flexDirection: "row",
+    justifyContent: "center",
+  },
+  badge: {
+    marginRight: 15,
+  },
+  labelText: {
+    textAlign: "left",
+    fontSize: 13,
+    paddingHorizontal: 10,
+    minWidth: 120,
+  },
+  homeCard: {
+    position: "absolute",
+    left: 13,
+    top: 66,
+    right: 13,
+    zIndex: 2,
+  },
+  mainContent: {
+    marginTop: 100,
+    backgroundColor: "transparent",
+  },
+  tab: {
+    backgroundColor: "#eee",
+  },
+  tabContainer: {
+    backgroundColor: "transparent",
+  },
+  tabIndicator: {
+    backgroundColor: "#FFC21C",
+  },
 });
 
-
-
-
 const Tab = createMaterialTopTabNavigator();
 const labelText = (focused, title) => (
-  <Text category='s1' status={focused ? "primary" : ""}>
+  <Text category="s1" status={focused ? "primary" : ""}>
     {title}
   </Text>
 );
-const NextIcon = props => <Icon {...props} name='arrow-ios-downward' />;
-
-const SearchIcon = props => <Icon {...props} name='search-outline' />;
-const MailIcon = props => <Icon {...props} name='email-outline' />;
-const ShareIcon = props => <Icon {...props} name='share-outline' />;
+const NextIcon = props => <Icon {...props} name="arrow-ios-downward" />;
 
-const MenuIcon = props => <Icon {...props} name='more-vertical' />;
+const SearchIcon = props => <Icon {...props} name="search-outline" />;
+const MailIcon = props => <Icon {...props} name="email-outline" />;
+const ShareIcon = props => <Icon {...props} name="share-outline" />;
 
-const LogoutIcon = props => <Icon {...props} name='log-out' />;
+const MenuIcon = props => <Icon {...props} name="more-vertical" />;
 
-const img1 = require("../assets/images/zan.png")
+const LogoutIcon = props => <Icon {...props} name="log-out" />;
 
-const img2 = require("../assets/images/cai.png")
+const img1 = require("../assets/images/zan.png");
 
+const img2 = require("../assets/images/cai.png");
 
 export default function HomeScreen({ navigation, route }) {
-    const theme = useTheme();
-    const { changeBackground } = useModel("barModel");
-    const {
-        showName,
-        logo,
-        proclamation,
-        updateMerchant,
-        banner,
-        userLogout,
-        monthSales,
-        goodNum,
-        badNum,
-    } = useModel("userModel");
+  const theme = useTheme();
+  const { changeBackground } = useModel("barModel");
+  const {
+    showName,
+    logo,
+    proclamation,
+    updateMerchant,
+    banner,
+    userLogout,
+    monthSales,
+    goodNum,
+    badNum,
+    firstOrder,
+  } = useModel("userModel");
 
-    const {
-        homeBar,
-        homeTip1,
-        homeTitle3,
-        homeTip2,
-        homeTip3,
-        homeTab1,
-        homeTab2,
-        homeTab3,
-        fullReduction2,
-        fullReduction1,
-    } = useModel("wordsModel");
-    const [fullReductions, changeFllReduction] = React.useState([]);
-    const { showDialog } = useModel("dialogModel", true);
-    const { httpGet } = useModel("httpModel", true);
+  const {
+    homeBar,
+    homeTip1,
+    homeTitle3,
+    homeTip2,
+    homeTip3,
+    homeTab1,
+    homeTab2,
+    homeTab3,
+    fullReduction2,
+    fullReduction1,
+  } = useModel("wordsModel");
+  const [fullReductions, changeFllReduction] = React.useState([]);
+  const { showDialog } = useModel("dialogModel", true);
+  const { httpGet } = useModel("httpModel", true);
+  const { getMyList } = useModel("couponModel", true);
 
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-            httpGet("/fullReduction/my").then(res => {
-                changeFllReduction(res);
-            });
-        }, [])
-    );
+  const [couponList, setCouponList] = React.useState([]);
+  const couponTips = React.useMemo(() => {
+    if (couponList.length > 0) {
+      return couponList
+        .map(item => {
+          return item.name;
+        })
+        .join(",");
+    }
+    return "";
+  }, [couponList]);
 
-    const [menuVisible, setMenuVisible] = React.useState(false);
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
+      httpGet("/fullReduction/my").then(res => {
+        changeFllReduction(res);
+      });
+      getMyList(0, 5).then(res => {
+        setCouponList(res.content);
+      });
+    }, [])
+  );
 
-    const toggleMenu = () => {
-        setMenuVisible(!menuVisible);
-    };
+  const [menuVisible, setMenuVisible] = React.useState(false);
 
-    const renderMenuAction = () => (
-      <TopNavigationAction icon={MenuIcon} onPress={toggleMenu} />
-    );
+  const toggleMenu = () => {
+    setMenuVisible(!menuVisible);
+  };
 
-    const renderRightActions = () => (
-      <>
-        <TopNavigationAction icon={SearchIcon} />
-        <TopNavigationAction
-          icon={MailIcon}
+  const renderMenuAction = () => (
+    <TopNavigationAction icon={MenuIcon} onPress={toggleMenu} />
+  );
+
+  const renderRightActions = () => (
+    <>
+      <TopNavigationAction
+        icon={SearchIcon}
+        onPress={() => {
+          RootNavigation.navigate("Search");
+        }}
+      />
+      <TopNavigationAction
+        icon={MailIcon}
+        onPress={() => {
+          RootNavigation.navigate("SystemEmail");
+        }}
+      />
+      <TopNavigationAction icon={ShareIcon} />
+      <OverflowMenu
+        anchor={renderMenuAction}
+        visible={menuVisible}
+        onBackdropPress={toggleMenu}
+      >
+        <MenuItem
+          accessoryLeft={LogoutIcon}
+          title="退出登录"
           onPress={() => {
-                    RootNavigation.navigate("SystemEmail");
-                }}
+            toggleMenu();
+            userLogout();
+          }}
         />
-        <TopNavigationAction icon={ShareIcon} />
-        <OverflowMenu
-          anchor={renderMenuAction}
-          visible={menuVisible}
-          onBackdropPress={toggleMenu}
-        >
-          {/* <MenuItem accessoryLeft={InfoIcon} title='切换语言' /> */}
-          <MenuItem
-            accessoryLeft={LogoutIcon}
-            title='退出登录'
-            onPress={() => {
-                        toggleMenu();
-                        userLogout();
-                    }}
-          />
-        </OverflowMenu>
-      </>
-    );
+        <MenuItem title="05.29.0.2版本" />
+      </OverflowMenu>
+    </>
+  );
 
-    const renderBackAction = () => <Text category='h6'>{homeBar}</Text>;
+  const renderBackAction = () => <Text category="h6">{homeBar}</Text>;
 
-    const badgeList = list => {
-        return list.map(item => {
-            return (
-              <Badge style={styles.badge} key={item.id}>
-                {fullReduction1}
-                {item.fullAmount}
-                {fullReduction2}
-                {item.minusAmount}
-              </Badge>
-            );
-        });
-    };
-	const [scrollRef, setScroll] = React.useState();
+  const badgeList = list => {
+    return list.map(item => {
+      return (
+        <Badge style={styles.badge} key={item.id}>
+          {fullReduction1}
+          {item.fullAmount}
+          {fullReduction2}
+          {item.minusAmount}
+        </Badge>
+      );
+    });
+  };
+  const [scrollRef, setScroll] = React.useState();
 
-    React.useEffect(() => {
-        const unsubscribe = navigation.addListener("tabPress", () => {
-            if (route.name === "Home") {
-                navigation.jumpTo("homeTab1");
-                if (scrollRef) {
-                    scrollRef.scrollTo({ x: 0, y: 0, animated: true });
-                }
-            }
-        });
+  React.useEffect(() => {
+    const unsubscribe = navigation.addListener("tabPress", () => {
+      if (route.name === "Home") {
+        navigation.jumpTo("homeTab1");
+        if (scrollRef) {
+          scrollRef.scrollTo({ x: 0, y: 0, animated: true });
+        }
+      }
+    });
 
-        return unsubscribe;
-	}, [navigation]);
+    return unsubscribe;
+  }, [navigation]);
 
-
- 
-    return (
-      <>
-        <TopNavigation
-          appearance='homeBar'
-          alignment='center'
-          accessoryLeft={renderBackAction}
-          accessoryRight={renderRightActions}
-        />
-        <ScrollView contentContainerStyle={{ flexGrow: 1 }} ref={setScroll}>
-          <Layout style={styles.container}>
-            <ImageBackground
-              source={{ uri: banner }}
-              style={styles.banner}
+  return (
+    <>
+      <TopNavigation
+        appearance="homeBar"
+        alignment="center"
+        accessoryLeft={renderBackAction}
+        accessoryRight={renderRightActions}
+      />
+      {couponList.length > 0 && (
+        <NoticeBar
+          mode="link"
+          onPress={() => {
+            RootNavigation.navigate("CouponList");
+          }}
+          marqueeProps={{ loop: true, style: { fontSize: 12, color: "red" } }}
+        >
+          店铺有新的优惠券了 {couponTips}
+        </NoticeBar>
+      )}
+      <ScrollView contentContainerStyle={{ flexGrow: 1 }} ref={setScroll}>
+        <Layout style={styles.container}>
+          <ImageBackground source={{ uri: banner }} style={styles.banner}>
+            <Button
+              appearance="bannerButton"
+              onPress={() =>
+                RootNavigation.navigate("EditBanner", {
+                  type: "banner",
+                })
+              }
             >
-              <Button
-                appearance='bannerButton'
-                onPress={() =>
-                                RootNavigation.navigate("EditBanner", {
-                                    type: "banner",
-                                })}
-              >
-                {homeTip1}
-              </Button>
-            </ImageBackground>
+              {homeTip1}
+            </Button>
+          </ImageBackground>
 
-            <Card
-              disabled
-              appearance='homeCard'
-              style={styles.homeCard}
+          <Card disabled appearance="homeCard" style={styles.homeCard}>
+            <TouchableOpacity
+              style={styles.touch}
+              onPress={() =>
+                RootNavigation.navigate("EditBanner", {
+                  type: "logo",
+                })
+              }
             >
-              <TouchableOpacity
-                style={styles.touch}
-                onPress={() =>
-                                RootNavigation.navigate("EditBanner", {
-                                    type: "logo",
-                                })}
-              >
-                <Image source={{ uri: logo }} style={styles.icon} />
-              </TouchableOpacity>
+              <Image source={{ uri: logo }} style={styles.icon} />
+            </TouchableOpacity>
 
-              <Layout style={styles.cardMain}>
-                <Layout style={styles.cardTop}>
-                  <Text>{showName}</Text>
-                  <Layout style={[styles.FlexRow]}>
-                    <Layout
-                      style={[styles.FlexRow, styles.layItem]}
-                    >
-                      <Image
-                        source={img1}
-                        style={styles.zanImg}
-                      />
-                      <Text category='c1' status='primary'>
-                        {goodNum || 0}
-                      </Text>
-                    </Layout>
-                    <Layout
-                      style={[styles.FlexRow, styles.layItem]}
-                    >
-                      <Image
-                        source={img2}
-                        style={styles.zanImg}
-                      />
-                      <Text category='c1' status='info'>
-                        {badNum || 0}
-                      </Text>
-                    </Layout>
-                    <Layout>
-                      <Text category='c1' status='info'>
-                        {homeTip2}
-                        :
-                        {monthSales || 0}
-                      </Text>
-                    </Layout>
+            <Layout style={styles.cardMain}>
+              <Layout style={styles.cardTop}>
+                <Text>{showName}</Text>
+                {firstOrder != null && firstOrder !== "" && firstOrder > 0 && (
+                  <Button
+                    appearance="ghost"
+                    status="info"
+                    onPress={() => {
+                      RootNavigation.navigate("FirstOrder");
+                    }}
+                  >
+                    <Text category="h1" status="danger">
+                      新用户立减 {firstOrder}
+                    </Text>
+                  </Button>
+                )}
+                <Layout style={[styles.FlexRow]}>
+                  <Layout style={[styles.FlexRow, styles.layItem]}>
+                    <Image source={img1} style={styles.zanImg} />
+                    <Text category="c1" status="primary">
+                      {goodNum || 0}
+                    </Text>
+                  </Layout>
+                  <Layout style={[styles.FlexRow, styles.layItem]}>
+                    <Image source={img2} style={styles.zanImg} />
+                    <Text category="c1" status="info">
+                      {badNum || 0}
+                    </Text>
+                  </Layout>
+                  <Layout>
+                    <Text category="c1" status="info">
+                      {`${homeTip2} :`}
+                      {monthSales || 0}
+                    </Text>
                   </Layout>
-                </Layout>
-                <Layout style={styles.badges}>
-                  {badgeList(fullReductions)}
                 </Layout>
               </Layout>
-              <Button
-                appearance='ghost'
-                status='info'
-                accessoryRight={NextIcon}
-                onPress={() => {
-                                showDialog({
-                                    pla: "",
-                                    maxLength: 50,
-                                    defaultValue: proclamation,
-                                    isEdit: true,
-                                    title: homeTitle3,
-                                    cancelable: true,
-                                    confirmCallback: info => {
-                                        updateMerchant({ proclamation: info });
-                                    },
-                                });
-                            }}
+              <Layout style={styles.badges}>{badgeList(fullReductions)}</Layout>
+            </Layout>
+            <Button
+              appearance="ghost"
+              status="info"
+              accessoryRight={NextIcon}
+              onPress={() => {
+                showDialog({
+                  pla: "",
+                  maxLength: 50,
+                  defaultValue: proclamation,
+                  isEdit: true,
+                  title: homeTitle3,
+                  cancelable: true,
+                  confirmCallback: info => {
+                    updateMerchant({ proclamation: info });
+                  },
+                });
+              }}
+            >
+              <Text
+                style={styles.labelText}
+                numberOfLines={1}
+                ellipsizeMode="tail"
               >
-                <Text
-                  style={styles.labelText}
-                  numberOfLines={1}
-                  ellipsizeMode='tail'
-                >
-                  {homeTip3}
-                  :
-                  {proclamation || "暂无通告，点击编辑"}
-                </Text>
-              </Button>
-            </Card>
+                {`${homeTip3}:`}
+                {proclamation || "暂无通告，点击编辑"}
+              </Text>
+            </Button>
+          </Card>
 
-            <Layout style={styles.mainContent}>
-              <Tab.Navigator
-                initialRouteName='homeTab1'
-                lazy
-                backBehavior='initialRoute'
-                unmountOnBlur
-                tabBarOptions={{
-                                activeTintColor: "#FFC21C",
-                                inactiveTintColor: "#000",
-                                style: styles.tab,
-                                indicatorStyle: styles.tabIndicator,
-                                labelStyle: styles.tab,
-                            }}
-              >
-                <Tab.Screen
-                  name='homeTab1'
-                  component={HomePage1}
-                  options={{
-                                    tabBarLabel: ({ focused }) =>
-                                        labelText(focused, homeTab1),
-                                }}
-                />
-                <Tab.Screen
-                  name='homeTab2'
-                  component={HomePage2}
-                  options={{
-                                    tabBarLabel: ({ focused }) =>
-                                        labelText(focused, homeTab2),
-                                }}
-                />
-                <Tab.Screen
-                  name='homeTab3'
-                  component={HomePage3}
-                  options={{
-                                    tabBarLabel: ({ focused }) =>
-                                        labelText(focused, homeTab3),
-                                }}
-                />
-              </Tab.Navigator>
-            </Layout>
+          <Layout style={styles.mainContent}>
+            <Tab.Navigator
+              initialRouteName="homeTab1"
+              lazy
+              backBehavior="initialRoute"
+              unmountOnBlur
+              tabBarOptions={{
+                activeTintColor: "#FFC21C",
+                inactiveTintColor: "#000",
+                style: styles.tab,
+                indicatorStyle: styles.tabIndicator,
+                labelStyle: styles.tab,
+              }}
+            >
+              <Tab.Screen
+                name="homeTab1"
+                component={HomePage1}
+                options={{
+                  tabBarLabel: ({ focused }) => labelText(focused, homeTab1),
+                }}
+              />
+              <Tab.Screen
+                name="homeTab2"
+                component={HomePage2}
+                options={{
+                  tabBarLabel: ({ focused }) => labelText(focused, homeTab2),
+                }}
+              />
+              <Tab.Screen
+                name="homeTab3"
+                component={HomePage3}
+                options={{
+                  tabBarLabel: ({ focused }) => labelText(focused, homeTab3),
+                }}
+              />
+            </Tab.Navigator>
           </Layout>
-        </ScrollView>
-      </>
-    );
+        </Layout>
+      </ScrollView>
+    </>
+  );
 }
-
-
-

screens/HomeScreenPage1.js

@@ -1,17 +1,14 @@
 /* eslint-disable no-underscore-dangle */
 import * as React from "react";
 import {
-    Icon,
-    Text,
-    Card,
-    Layout,
-    ListItem,
-    Button,
+  Icon,
+  Text,
+  Card,
+  Layout,
+  ListItem,
+  Button,
 } from "@ui-kitten/components";
-import {
-    StyleSheet,
-    Dimensions,
-} from "react-native";
+import { StyleSheet, Dimensions } from "react-native";
 import { useFocusEffect } from "@react-navigation/native";
 import { useModel } from "flooks";
 import GoodsCard from "../components/GoodsCardVertical";
@@ -19,328 +16,313 @@ import GoodsCardLarge from "../components/GoodsCard";
 import * as RootNavigation from "../navigation/RootNavigation";
 import EmptyComponent from "../components/EmptyComponent";
 import {
-    ClassificationUtil,
-    getClassificationByName,
+  ClassificationUtil,
+  getClassificationByName,
 } from "../Utils/SystemRuleUtil";
 
 const styles = StyleSheet.create({
-    tabContainer: {
-        backgroundColor: "transparent",
-        flex: 1,
-    },
-    goodsList: {
-        flexDirection: "row",
-        justifyContent: "space-between",
-        paddingVertical: 10,
-        width: Dimensions.get("window").width - 30,
-        backgroundColor: "#F0F0F0",
-    },
-    title: {
-        alignSelf: "stretch",
-    },
-    card: {
-        alignItems: "center",
-        backgroundColor: "#F0F0F0",
-    },
-    container: {
-        backgroundColor: "#F0F0F0",
-        maxWidth: 93,
-        paddingBottom: 100,
-        width: 93,
-        flexShrink: 0,
-    },
-    content: {
-        flexDirection: "row",
-        minHeight: 200,
-        flex: 1,
-    },
-    goodsContainer: {
-        flex: 1,
-        backgroundColor: "#FFFFFF",
-        paddingBottom: 100,
-        paddingTop: 10,
-    },
-    classificat: {
-        backgroundColor: "#F0F0F0",
-    },
-    addClassificat: {
-        width: 36,
-        alignSelf: "center",
-        marginTop: 20,
-    },
-    addGoods: {
-        width: 40,
-        height: 40,
-        alignSelf: "flex-end",
-        marginTop: 20,
-        marginRight: 15,
-    },
-    add: {
-        flex: 1,
-        backgroundColor: "#FFF5D8",
-        borderColor: "#FFF5D8",
-        minHeight: 232,
-        marginHorizontal: 2,
-    },
-    selectItem: {
-        color: "#FFC21C",
-        fontWeight: "bold",
-    },
-    hid: {
-        width: 10,
-        height: 10,
-        position: "absolute",
-        right: -10,
-    },
+  tabContainer: {
+    backgroundColor: "transparent",
+    flex: 1,
+  },
+  goodsList: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    paddingVertical: 10,
+    width: Dimensions.get("window").width - 30,
+    backgroundColor: "#F0F0F0",
+  },
+  title: {
+    alignSelf: "stretch",
+  },
+  card: {
+    alignItems: "center",
+    backgroundColor: "#F0F0F0",
+  },
+  container: {
+    backgroundColor: "#F0F0F0",
+    maxWidth: 93,
+    paddingBottom: 100,
+    width: 93,
+    flexShrink: 0,
+  },
+  content: {
+    flexDirection: "row",
+    minHeight: 200,
+    flex: 1,
+  },
+  goodsContainer: {
+    flex: 1,
+    backgroundColor: "#FFFFFF",
+    paddingBottom: 100,
+    paddingTop: 10,
+  },
+  classificat: {
+    backgroundColor: "#F0F0F0",
+  },
+  addClassificat: {
+    width: 36,
+    alignSelf: "center",
+    marginTop: 20,
+  },
+  addGoods: {
+    width: 40,
+    height: 40,
+    alignSelf: "flex-end",
+    marginTop: 20,
+    marginRight: 15,
+  },
+  add: {
+    flex: 1,
+    backgroundColor: "#FFF5D8",
+    borderColor: "#FFF5D8",
+    minHeight: 232,
+    marginHorizontal: 2,
+  },
+  selectItem: {
+    color: "#FFC21C",
+    fontWeight: "bold",
+  },
+  hid: {
+    width: 10,
+    height: 10,
+    position: "absolute",
+    right: -10,
+  },
 });
 
+const StarIcon = props => <Icon {...props} name="plus" />;
 
+export default function HomePage1() {
+  const { httpPost, httpGet } = useModel("httpModel", true);
+  const [classifications, setClassifications] = React.useState([]);
+  const [selectId, changeSelectId] = React.useState(0);
+  const [goods, setGoods] = React.useState([]);
+  const [goodsClass, setGoodsClass] = React.useState([]);
+  const { showDialog } = useModel("dialogModel", true);
+  const { success } = useModel("loadingModel", true);
+  const { removeTips, remove, successText } = useModel("wordsModel");
+  const { changeBackground } = useModel("barModel");
+  const {
+    classificationId,
+    setClassificationId,
+    getMyClassification,
+    Classifications,
+  } = useModel("goodsModel");
 
-const StarIcon = props => <Icon {...props} name='plus' />;
+  function getGoods() {
+    httpGet("/goods/my").then(res => {
+      setGoods(res);
+    });
+  }
 
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground("#fff");
+      getMyClassification().then(res => {
+        if (!classificationId) {
+          const _classifications = [...res];
+          const { id } = _classifications.shift() || {};
+          changeSelectId(id);
+        } else {
+          changeSelectId(classificationId);
+        }
+        setClassificationId(0);
+      });
+      getGoods();
+    }, [])
+  );
+  React.useEffect(() => {
+    setClassifications(Classifications);
+  }, [Classifications]);
 
-export default function HomePage1() {
-    const { httpPost, httpGet } = useModel("httpModel", true);
-    const [classifications, setClassifications] = React.useState([]);
-    const [selectId, changeSelectId] = React.useState(0);
-    const [goods, setGoods] = React.useState([]);
-    const [goodsClass, setGoodsClass] = React.useState([]);
-    const { showDialog } = useModel("dialogModel", true);
-    const { success } = useModel("loadingModel", true);
-    const { removeTips, remove, successText } = useModel("wordsModel");
-    const { changeBackground } = useModel("barModel");
-    const {
-        classificationId,
-        setClassificationId,
-        getMyClassification,
-        Classifications,
-	} = useModel("goodsModel");
-	
-	function getGoods() {
-        httpGet("/goods/my").then(res => {
-            setGoods(res);
-        });
+  const topGoods = React.useMemo(() => {
+    return goods.filter(item => {
+      return item.recommend;
+    });
+  }, [goods]);
+
+  React.useEffect(() => {
+    function getAllGoods() {
+      httpGet("/classification/allGoods", {
+        classificationId: selectId,
+      }).then(res => {
+        setGoodsClass(
+          res.filter(item => {
+            return item != null;
+          })
+        );
+      });
+    }
+    if (selectId) {
+      getAllGoods();
     }
+  }, [selectId]);
 
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground("#fff");
-            getMyClassification().then(res => {
-                if (!classificationId) {
-                    const _classifications = [...res];
-                    const { id } = _classifications.shift() || {};
-                    changeSelectId(id);
-                } else {
-                    changeSelectId(classificationId);
-                }
-                setClassificationId(0);
-            });
-            getGoods();
-        }, [])
+  const selectClassInfo = React.useMemo(() => {
+    return (
+      classifications.find(item => {
+        return item.id === selectId;
+      }) || {}
     );
-    React.useEffect(() => {
-        setClassifications(Classifications);
-    }, [Classifications]);
-
-  
-    const topGoods = React.useMemo(() => {
-        return goods.filter(item => {
-            return item.signboard;
-        });
-	}, [goods]);
-	
-	
-
+  }, [selectId, classifications]);
 
+  const classificationList = () => {
+    return classifications.map((item, index) => {
+      return (
+        <ListItem
+          appearance="classification"
+          key={index}
+          title={textprops => (
+            <Text
+              {...textprops}
+              style={[
+                textprops.style,
+                { textAlign: "center" },
+                item.id === selectId && styles.selectItem,
+              ]}
+            >
+              {item.name}
+            </Text>
+          )}
+          accessoryRight={props => {
+            if (!item.isOpen) {
+              return (
+                <Icon
+                  fill="rgb(241, 90, 60)"
+                  {...props}
+                  style={[props.style, styles.hid]}
+                  name="power"
+                />
+              );
+            }
+            return null;
+          }}
+          onPress={() => {
+            changeSelectId(item.id);
+          }}
+        />
+      );
+    });
+  };
 
-    React.useEffect(() => {
-        function getAllGoods() {
-            httpGet("/classification/allGoods", {
-                classificationId: selectId,
-            }).then(res => {
-                setGoodsClass(
-                    res.filter(item => {
-                        return item != null;
-                    })
-                );
-            });
-        }
-        if (selectId) {
-            getAllGoods();
-        }
-    }, [selectId]);
-
-    const selectClassInfo = React.useMemo(() => {
-        return (
-            classifications.find(item => {
-                return item.id === selectId;
-            }) || {}
-        );
-    }, [selectId, classifications]);
+  const classGoodsList = () => {
+    return goodsClass.map((item, index) => {
+      return (
+        <GoodsCardLarge key={index} appearance="classification" info={item} />
+      );
+    });
+  };
 
-    const classificationList = () => {
-        return classifications.map((item, index) => {
-            return (
-              <ListItem
-                appearance='classification'
-                key={index}
-                title={textprops => (
-                  <Text
-                    {...textprops}
-                    style={[
-                                textprops.style,
-                                { textAlign: "center" },
-                                item.id === selectId && styles.selectItem,
-                            ]}
-                  >
-                    {item.name}
-                  </Text>
-                    )}
-                accessoryRight={props => {
-                        if (!item.isOpen) {
-                            return (
-                              <Icon
-                                fill='rgb(241, 90, 60)'
-                                {...props}
-                                style={[props.style, styles.hid]}
-                                name='power'
-                              />
-                            );
-                        } 
-                            return null;
-                        
-                    }}
-                onPress={() => {
-                        changeSelectId(item.id);
-                    }}
-              />
-            );
-        });
-    };
+  const PulsIcon = props => (
+    <Icon
+      {...props}
+      // eslint-disable-next-line react/destructuring-assignment
+      style={[props.style, { width: 50, height: 50 }]}
+      name="plus"
+    />
+  );
 
-    const classGoodsList = () => {
-        return goodsClass.map((item, index) => {
-            return (
-              <GoodsCardLarge
-                key={index}
-                appearance='classification'
-                info={item}
-              />
-            );
-        });
-    };
+  function changeSignboard(id, signboard) {
+    httpPost(
+      "/goods/save",
+      {
+        id,
+        recommend: signboard,
+      },
+      { body: "json" }
+    ).then(() => {
+      success(remove + successText);
+      getGoods();
+    });
+  }
 
-    const PulsIcon = props => (
-      <Icon
-        {...props}
-        // eslint-disable-next-line react/destructuring-assignment
-        style={[props.style, { width: 50, height: 50 }]}
-        name='plus'
-      />
-	);
-	
-	
-    function changeSignboard(id, signboard) {
-        httpPost(
-            "/goods/save",
-            {
-                id,
-                signboard,
-            },
-            { body: "json" }
-        ).then(() => {
-            success(remove + successText);
-            getGoods();
-        });
+  const topGoodsMap = list => {
+    const _list = list.map((item, index) => {
+      return (
+        <GoodsCard
+          info={item}
+          key={index}
+          removeEvent={() => {
+            showDialog({
+              bodyText: removeTips,
+              status: "danger",
+              cancelable: true,
+              confirmCallback: () => {
+                changeSignboard(item.id, false, remove);
+              },
+            });
+          }}
+        />
+      );
+    });
+    if (_list.length === 0) {
+      _list.push(
+        <Button
+          style={styles.add}
+          accessoryLeft={PulsIcon}
+          key={1}
+          onPress={() => {
+            RootNavigation.navigate("AddClassification", {
+              type: "recommend",
+            });
+          }}
+        />
+      );
     }
+    if (_list.length === 1) {
+      _list.push(
+        <Button
+          style={styles.add}
+          accessoryLeft={PulsIcon}
+          key={2}
+          onPress={() => {
+            RootNavigation.navigate("AddClassification", {
+              type: "recommend",
+            });
+          }}
+        />
+      );
+    }
+    return _list;
+  };
 
-    const topGoodsMap = list => {
-        const _list = list.map((item, index) => {
-            return (
-              <GoodsCard
-                info={item}
-                key={index}
-                removeEvent={() => {
-                        showDialog({
-                            bodyText: removeTips,
-                            status: "danger",
-                            cancelable: true,
-                            confirmCallback: () => {
-                                changeSignboard(item.id, false, remove);
-                            },
-                        });
-                    }}
-              />
-            );
-        });
-        if (_list.length === 0) {
-            _list.push(
-              <Button
-                style={styles.add}
-                accessoryLeft={PulsIcon}
-                key={1}
-                onPress={() => {
-                        RootNavigation.navigate("AddClassification", {
-                            type: "signboard",
-                        });
-                    }}
-              />
-            );
-        }
-        if (_list.length === 1) {
-            _list.push(
-              <Button
-                style={styles.add}
-                accessoryLeft={PulsIcon}
-                key={2}
-                onPress={() => {
-                        RootNavigation.navigate("AddClassification");
-                    }}
-              />
-            );
-        }
-        return _list;
-    };
-
-
-    return (
-      <>
-        <Layout style={styles.tabContainer}>
-          <Card
-            appearance='homePage1Card'
-            disabled
-            style={styles.card}
-            backgroundColor='#F0F0F0'
-            header={props => (
-              <Text {...props} style={[styles.title, props.style]}>
-                店主推荐
-              </Text>
-                    )}
-          >
-            {/* <List
+  return (
+    <>
+      <Layout style={styles.tabContainer}>
+        <Card
+          appearance="homePage1Card"
+          disabled
+          style={styles.card}
+          backgroundColor="#F0F0F0"
+          header={props => (
+            <Text {...props} style={[styles.title, props.style]}>
+              店主推荐
+            </Text>
+          )}
+        >
+          {/* <List
                     style={styles.goodsList}
                     data={topGoods}
                     renderItem={topGoodsItem}
                 /> */}
-            <Layout style={styles.goodsList}>
-              {topGoodsMap(topGoods)}
-            </Layout>
-          </Card>
+          <Layout style={styles.goodsList}>{topGoodsMap(topGoods)}</Layout>
+        </Card>
 
-          <Layout style={styles.content}>
-            <Layout style={styles.container}>
-              {classificationList()}
-              <Button
-                style={styles.addClassificat}
-                appearance='classification'
-                onPress={() => {
-                                RootNavigation.navigate("ClassificationManage");
-                            }}
-              >
-                编辑分类
-              </Button>
-            </Layout>
-            {/* <List
+        <Layout style={styles.content}>
+          <Layout style={styles.container}>
+            {classificationList()}
+            <Button
+              style={styles.addClassificat}
+              appearance="classification"
+              onPress={() => {
+                RootNavigation.navigate("ClassificationManage");
+              }}
+            >
+              编辑分类
+            </Button>
+          </Layout>
+          {/* <List
                         style={styles.container}
                         data={classifications}
                         renderItem={classificationItem}
@@ -348,48 +330,44 @@ export default function HomePage1() {
                          
                         )}
                     /> */}
-            <Layout style={styles.goodsContainer}>
-              {classGoodsList()}
+          <Layout style={styles.goodsContainer}>
+            {classGoodsList()}
 
-              {goodsClass.length === 0 && <EmptyComponent />}
+            {goodsClass.length === 0 && <EmptyComponent />}
 
-              <Button
-                style={styles.addGoods}
-                appearance='classification'
-                status='danger'
-                accessoryLeft={StarIcon}
-                onPress={() => {
-                                const _classificationUtil = new ClassificationUtil(
-                                    selectClassInfo
-                                );
-                                if (
-                                    _classificationUtil.getType() ===
-                                        getClassificationByName("好评") ||
-                                    _classificationUtil.getType() ===
-                                        getClassificationByName("折扣")
-                                ) {
-                                    setClassificationId(selectId);
-                                    RootNavigation.navigate(
-                                        "SystemClassificationEdit",
-                                        {
-                                            classifyId: selectId,
-                                        }
-                                    );
-                                } else {
-                                    setClassificationId(selectId);
-                                    RootNavigation.navigate("AddGoods", {
-                                        classifyId: selectId,
-                                    });
-                                }
-                            }}
-              />
-            </Layout>
+            <Button
+              style={styles.addGoods}
+              appearance="classification"
+              status="danger"
+              accessoryLeft={StarIcon}
+              onPress={() => {
+                const _classificationUtil = new ClassificationUtil(
+                  selectClassInfo
+                );
+                if (
+                  _classificationUtil.getType() ===
+                    getClassificationByName("好评") ||
+                  _classificationUtil.getType() ===
+                    getClassificationByName("折扣")
+                ) {
+                  setClassificationId(selectId);
+                  RootNavigation.navigate("SystemClassificationEdit", {
+                    classifyId: selectId,
+                  });
+                } else {
+                  setClassificationId(selectId);
+                  RootNavigation.navigate("AddGoods", {
+                    classifyId: selectId,
+                  });
+                }
+              }}
+            />
           </Layout>
         </Layout>
-      </>
-    );
+      </Layout>
+    </>
+  );
 }
 // const goodsItem = ({ item, index }) => (
 //     <GoodsCardLarge key={index} appearance='classification' info={item} />
 // );
-

screens/HomeScreenPage2.js

@@ -1,103 +1,93 @@
 import * as React from "react";
-import {
-    Layout,
-    Button,
-} from "@ui-kitten/components";
-import {
-    StyleSheet,
-} from "react-native";
+import { Layout, Button } from "@ui-kitten/components";
+import { StyleSheet } from "react-native";
 import { useModel } from "flooks";
 import CommentCard from "../components/Comment";
 import Badge from "../components/Badge";
 import * as RootNavigation from "../navigation/RootNavigation";
 
-
-
-
 const styles = StyleSheet.create({
-    tabContainer: {
-        backgroundColor: "#fff",
-        paddingTop: 20,
-        paddingBottom: 80,
-        flex: 1,
-    },
-    bageList: {
-        flexDirection: "row",
-        flexWrap: "wrap",
-        paddingHorizontal: 15,
-        paddingBottom: 9,
-    },
-    back: {
-        paddingHorizontal: 13,
-        paddingVertical: 5,
-        flexDirection: "row",
-        justifyContent: "flex-end",
-    },
-    backText: {
-        width: 200,
-        borderRadius: 3,
-        backgroundColor: "#EEEEEE",
-        height: 23,
-        lineHeight: 23,
-        paddingLeft: 5,
-    },
-    backButtn: {
-        marginLeft: 10,
-    },
-    container: {},
+  tabContainer: {
+    backgroundColor: "#fff",
+    paddingTop: 20,
+    paddingBottom: 80,
+    flex: 1,
+  },
+  bageList: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    paddingHorizontal: 15,
+    paddingBottom: 9,
+  },
+  back: {
+    paddingHorizontal: 13,
+    paddingVertical: 5,
+    flexDirection: "row",
+    justifyContent: "flex-end",
+  },
+  backText: {
+    width: 200,
+    borderRadius: 3,
+    backgroundColor: "#EEEEEE",
+    height: 23,
+    lineHeight: 23,
+    paddingLeft: 5,
+  },
+  backButtn: {
+    marginLeft: 10,
+  },
+  container: {},
 });
 
-
-
 export default function HomePage2() {
-     // eslint-disable-next-line no-unused-vars
-     const [commentList, setCommentList] = React.useState([{}, {}, {}]);
-
-    const { editAutoBack } = useModel("wordsModel");
+  // eslint-disable-next-line no-unused-vars
+  const [commentList, setCommentList] = React.useState([{}, {}, {}]);
 
-    const allCommentList = () => {
-        return commentList.map((item, index) => {
-            return <CommentCard key={index} />;
-        });
-    };
+  const { editAutoBack } = useModel("wordsModel");
 
-    return (
-      <Layout style={styles.tabContainer}>
-        <Layout style={styles.bageList}>
-          <Badge appearance='fill' status='warning' right={5} bottom={4}>
-            全部7345
-          </Badge>
-          <Badge appearance='fill' right={5} bottom={4}>
-            最新
-          </Badge>
-          <Badge appearance='fill' right={5} bottom={4}>
-            好评1213
-          </Badge>
-          <Badge appearance='fill' status='info' right={5} bottom={4}>
-            差评12
-          </Badge>
-          <Badge appearance='fill' right={5} bottom={4}>
-            最新
-          </Badge>
-          <Badge appearance='fill' right={5} bottom={4}>
-            好评1213
-          </Badge>
-          <Badge appearance='fill' status='info' right={5} bottom={4}>
-            差评12
-          </Badge>
-        </Layout>
-        <Layout style={styles.back}>
-          <Button
-            style={styles.backButtn}
-            onPress={() => {
-                        RootNavigation.navigate("Automatic");
-                    }}
-          >
-            {editAutoBack}
-          </Button>
-        </Layout>
+  const allCommentList = () => {
+    return commentList.map((item, index) => {
+      return <CommentCard key={index} />;
+    });
+  };
 
-        <Layout style={styles.container}>{allCommentList()}</Layout>
+  return (
+    <Layout style={styles.tabContainer}>
+      <Layout style={styles.bageList}>
+        <Badge appearance="fill" status="warning" right={5} bottom={4}>
+          全部7345
+        </Badge>
+        <Badge appearance="fill" right={5} bottom={4}>
+          最新
+        </Badge>
+        <Badge appearance="fill" right={5} bottom={4}>
+          好评1213
+        </Badge>
+        <Badge appearance="fill" status="info" right={5} bottom={4}>
+          差评12
+        </Badge>
+        <Badge appearance="fill" right={5} bottom={4}>
+          最新
+        </Badge>
+        <Badge appearance="fill" right={5} bottom={4}>
+          好评1213
+        </Badge>
+        <Badge appearance="fill" status="info" right={5} bottom={4}>
+          差评12
+        </Badge>
       </Layout>
-    );
+      <Layout style={styles.back}>
+        <Button
+          style={styles.backButtn}
+          onPress={() => {
+            RootNavigation.navigate("Automatic");
+          }}
+        >
+          {editAutoBack}
+        </Button>
+      </Layout>
+
+      <Layout style={styles.container}>{allCommentList()}</Layout>
+    </Layout>
+  );
 }

screens/HomeScreenPage3.js

@@ -1,16 +1,14 @@
 /* eslint-disable no-underscore-dangle */
 import * as React from "react";
 import {
-    Icon,
-    Text,
-    Layout,
-    Button,
-    Menu,
-    MenuItem,
+  Icon,
+  Text,
+  Layout,
+  Button,
+  Menu,
+  MenuItem,
 } from "@ui-kitten/components";
-import {
-    StyleSheet,
-} from "react-native";
+import { StyleSheet } from "react-native";
 import { useModel } from "flooks";
 import Textarea from "react-native-textarea";
 import OpenTimeUtil from "../Utils/OpenTimeUtil";
@@ -18,75 +16,73 @@ import ListUtil from "../Utils/ListUtil";
 import UpLoadImage from "../components/UpLoadImage";
 import * as RootNavigation from "../navigation/RootNavigation";
 
-
 const ForwardIcon = props => (
   <Icon
     {...props}
-    name='arrow-ios-forward'
-    fill='#B4B4B4'
+    name="arrow-ios-forward"
+    fill="#B4B4B4"
     style={{ width: 15, height: 15, fontWeight: 500 }}
   />
-  );
-  
-  const styles = StyleSheet.create({
-	  tabContainer: {
-		  backgroundColor: "#fff",
-		  flex: 1,
-	  },
-	  top: {
-		  paddingVertical: 20,
-		  paddingHorizontal: 13,
-	  },
-	  imgList: {
-		  flexDirection: "row",
-	  },
-	  upload: {
-		  marginRight: 10,
-		  width: 67,
-		  flexShrink: 0,
-	  },
-	  textareaContainer: {
-		  backgroundColor: "#F0F0F0",
-		  height: 100,
-		  alignSelf: "stretch",
-		  borderRadius: 4,
-	  },
-	  textarea: {
-		  textAlignVertical: "top", // hack android
-		  fontSize: 13,
-		  color: "#333",
-		  paddingHorizontal: 14,
-		  paddingVertical: 10,
-		  height: 100,
-	  },
-	  text: {
-		  paddingVertical: 10,
-	  },
-	  button: {
-		  alignSelf: "flex-end",
-		  marginTop: 10,
-		  marginRight: 14,
-	  },
-	  menu: {
-		  borderColor: "#EEEEEE",
-		  borderTopWidth: 6,
-		  backgroundColor: "#fff",
-		  paddingHorizontal: 15,
-	  },
-	  menuItem: {},
-	  lable: {
-		  flexDirection: "row",
-		  flex: 1,
-	  },
-	  lableName: {
-		  flexShrink: 0,
-		  flexBasis: "50%",
-		  marginHorizontal: 8,
-		  fontSize: 13,
-	  },
-	  lableText: {}
-  });
-  
+);
+
+const styles = StyleSheet.create({
+  tabContainer: {
+    backgroundColor: "#fff",
+    flex: 1,
+  },
+  top: {
+    paddingVertical: 20,
+    paddingHorizontal: 13,
+  },
+  imgList: {
+    flexDirection: "row",
+  },
+  upload: {
+    marginRight: 10,
+    width: 67,
+    flexShrink: 0,
+  },
+  textareaContainer: {
+    backgroundColor: "#F0F0F0",
+    height: 100,
+    alignSelf: "stretch",
+    borderRadius: 4,
+  },
+  textarea: {
+    textAlignVertical: "top", // hack android
+    fontSize: 13,
+    color: "#333",
+    paddingHorizontal: 14,
+    paddingVertical: 10,
+    height: 100,
+  },
+  text: {
+    paddingVertical: 10,
+  },
+  button: {
+    alignSelf: "flex-end",
+    marginTop: 10,
+    marginRight: 14,
+  },
+  menu: {
+    borderColor: "#EEEEEE",
+    borderTopWidth: 6,
+    backgroundColor: "#fff",
+    paddingHorizontal: 15,
+  },
+  menuItem: {},
+  lable: {
+    flexDirection: "row",
+    flex: 1,
+  },
+  lableName: {
+    flexShrink: 0,
+    flexBasis: "50%",
+    marginHorizontal: 8,
+    fontSize: 13,
+  },
+  lableText: {},
+});
 
 const Label = (props, title, value) => (
   <Layout style={[styles.lable]}>
@@ -98,7 +94,7 @@ const Label = (props, title, value) => (
       // eslint-disable-next-line react/destructuring-assignment
       style={[props.style, styles.lableText]}
       numberOfLines={1}
-      ellipsizeMode='tail'
+      ellipsizeMode="tail"
     >
       {value}
     </Text>
@@ -106,202 +102,195 @@ const Label = (props, title, value) => (
 );
 
 export default function HomePage3() {
-	const { showDialog } = useModel("dialogModel", true);
-    const [text, changeText] = React.useState("");
-    const {
-        img,
-        updateMerchant,
-        introduction,
-        name,
-        phone,
-        address,
-        category,
-        week,
-        endTime,
-        startTime,
-    } = useModel("userModel");
-    const categoryList = new ListUtil(category);
-    const { success } = useModel("loadingModel");
+  const { showDialog } = useModel("dialogModel", true);
+  const [text, changeText] = React.useState("");
+  const {
+    img,
+    updateMerchant,
+    introduction,
+    name,
+    phone,
+    address,
+    category,
+    week,
+    endTime,
+    startTime,
+  } = useModel("userModel");
+  const categoryList = new ListUtil(category);
+  const { success } = useModel("loadingModel");
 
-    const {
-        home3Title1,
-        home3Title2,
-        confirm,
-        getWordsStr,
-        weekWords,
-    } = useModel("wordsModel");
+  const {
+    home3Title1,
+    home3Title2,
+    confirm,
+    getWordsStr,
+    weekWords,
+  } = useModel("wordsModel");
 
-    const imgList = React.useMemo(() => {
-        const list = img ? img.split(",") : [];
-        list.push("");
-        return [...new Set(list)];
-    }, [img]);
+  const imgList = React.useMemo(() => {
+    const list = img ? img.split(",") : [];
+    list.push("");
+    return [...new Set(list)];
+  }, [img]);
 
-    const openTime = React.useMemo(() => {
-        if (startTime && endTime && week && weekWords) {
-            // eslint-disable-next-line no-underscore-dangle
-            const _o = new OpenTimeUtil(startTime, endTime, week, weekWords());
-            return _o.getShowStr();
-        } 
-            return "";
-        
-    }, [startTime, endTime, week, weekWords]);
-
-    // eslint-disable-next-line no-shadow
-    function changeImg(img, index) {
-        const _imgs = [...imgList];
-        _imgs.splice(index, 1, img);
-        const _img1 = new Set(_imgs);
-        updateMerchant({
-            img: [..._img1].join(","),
-        });
+  const openTime = React.useMemo(() => {
+    if (startTime && endTime && week && weekWords) {
+      // eslint-disable-next-line no-underscore-dangle
+      const _o = new OpenTimeUtil(startTime, endTime, week, weekWords());
+      return _o.getShowStr();
     }
+    return "";
+  }, [startTime, endTime, week, weekWords]);
 
-    function delImg(index) {
-        const _imgs = [...imgList];
-        _imgs.splice(index, 1);
-        const _img1 = new Set(_imgs);
-        updateMerchant({
-            img: [..._img1].join(","),
-        });
-    }
+  // eslint-disable-next-line no-shadow
+  function changeImg(img, index) {
+    const _imgs = [...imgList];
+    _imgs.splice(index, 1, img);
+    const _img1 = new Set(_imgs);
+    updateMerchant({
+      img: [..._img1].join(","),
+    });
+  }
 
-    const showImgList = list => {
-        return list.map((item, index) => {
-            return (
-              <Layout key={index} style={styles.upload}>
-                <UpLoadImage
-                  value={item}
-                  // eslint-disable-next-line no-shadow
-                  changeIcon={img => changeImg(img, index)}
-                  size={67}
-                  hasCancel
-                  delEvent={() => {
-                            delImg(index);
-                        }}
-                />
-              </Layout>
-            );
-        });
-    };
+  function delImg(index) {
+    const _imgs = [...imgList];
+    _imgs.splice(index, 1);
+    const _img1 = new Set(_imgs);
+    updateMerchant({
+      img: [..._img1].join(","),
+    });
+  }
 
-    function showChange(key, val, title, max, type) {
-        showDialog({
-            pla: "",
-            maxLength: max || 50,
-            defaultValue: val,
-            InputType: type,
-            isEdit: true,
-            title,
-            cancelable: true,
-            confirmCallback: info => {
-                updateMerchant({ [key]: info });
-            },
-        });
-    }
+  const showImgList = list => {
+    return list.map((item, index) => {
+      return (
+        <Layout key={index} style={styles.upload}>
+          <UpLoadImage
+            value={item}
+            // eslint-disable-next-line no-shadow
+            changeIcon={img => changeImg(img, index)}
+            size={67}
+            hasCancel
+            delEvent={() => {
+              delImg(index);
+            }}
+          />
+        </Layout>
+      );
+    });
+  };
 
-    return (
-      <Layout style={styles.tabContainer}>
-        <Layout style={styles.top}>
-          <Layout style={styles.imgList}>{showImgList(imgList)}</Layout>
+  function showChange(key, val, title, max, type) {
+    showDialog({
+      pla: "",
+      maxLength: max || 50,
+      defaultValue: val,
+      InputType: type,
+      isEdit: true,
+      title,
+      cancelable: true,
+      confirmCallback: info => {
+        updateMerchant({ [key]: info });
+      },
+    });
+  }
 
-          <Layout>
-            <Text style={styles.text}>{home3Title1}</Text>
-            <Textarea
-              containerStyle={styles.textareaContainer}
-              style={styles.textarea}
-              onChangeText={changeText}
-              defaultValue={introduction}
-              maxLength={500}
-              placeholder={home3Title2}
-              placeholderTextColor="#B4B4B4"
-              underlineColorAndroid="transparent"
-            />
-            <Button
-              size='small'
-              style={styles.button}
-              onPress={() => {
-                            updateMerchant({
-                                introduction: text,
-                            }).then(() => {
-                                success("成功");
-                            });
-                        }}
-            >
-              {confirm}
-            </Button>
-          </Layout>
-        </Layout>
-        <Menu style={styles.menu}>
-          <MenuItem
-            title={props =>
-                        Label(props, getWordsStr("register_form_1"), name)}
-            accessoryRight={ForwardIcon}
-            style={styles.menuItem}
-            onPress={() =>
-                        showChange(
-                            "name",
-                            name,
-                            getWordsStr("register_form_1"),
-                            25,
-                            "text"
-                        )}
-          />
-          <MenuItem
-            title={props =>
-                        Label(
-                            props,
-                            getWordsStr("guideHome_form_1"),
-                            categoryList.getKey("name")
-                        )}
-            accessoryRight={ForwardIcon}
-            style={styles.menuItem}
-            onPress={() => {}}
-          />
-          <MenuItem
-            title={props =>
-                        Label(props, getWordsStr("guideHome_form_2"), address)}
-            accessoryRight={ForwardIcon}
-            style={styles.menuItem}
-            onPress={() =>
-                        showChange(
-                            "address",
-                            address,
-                            getWordsStr("guideHome_form_2")
-                        )}
-          />
-          <MenuItem
-            title={props =>
-                        Label(props, getWordsStr("guideHome_form_3"), phone)}
-            accessoryRight={ForwardIcon}
-            style={styles.menuItem}
-            onPress={() =>
-                        showChange(
-                            "phone",
-                            phone,
-                            getWordsStr("guideHome_form_3"),
-                            11,
-                            "phone"
-                        )}
-          />
-          <MenuItem
-            title={props =>
-                        Label(props, getWordsStr("guideHome_form_4"), openTime)}
-            accessoryRight={ForwardIcon}
-            style={styles.menuItem}
-            onPress={() => {}}
+  return (
+    <Layout style={styles.tabContainer}>
+      <Layout style={styles.top}>
+        <Layout style={styles.imgList}>{showImgList(imgList)}</Layout>
+
+        <Layout>
+          <Text style={styles.text}>{home3Title1}</Text>
+          <Textarea
+            containerStyle={styles.textareaContainer}
+            style={styles.textarea}
+            onChangeText={changeText}
+            defaultValue={introduction}
+            maxLength={500}
+            placeholder={home3Title2}
+            placeholderTextColor="#B4B4B4"
+            underlineColorAndroid="transparent"
           />
-          <MenuItem
-            title={getWordsStr("guideHome_form_5")}
-            accessoryRight={ForwardIcon}
-            style={styles.menuItem}
+          <Button
+            size="small"
+            style={styles.button}
             onPress={() => {
-                        RootNavigation.navigate("EditBanner", {
-                            type: "qualification",
-                        });
-                    }}
-          />
-        </Menu>
+              updateMerchant({
+                introduction: text,
+              }).then(() => {
+                success("成功");
+              });
+            }}
+          >
+            {confirm}
+          </Button>
+        </Layout>
       </Layout>
-    );
+      <Menu style={styles.menu}>
+        <MenuItem
+          title={props => Label(props, getWordsStr("register_form_1"), name)}
+          accessoryRight={ForwardIcon}
+          style={styles.menuItem}
+          onPress={() =>
+            showChange("name", name, getWordsStr("register_form_1"), 25, "text")
+          }
+        />
+        <MenuItem
+          title={props =>
+            Label(
+              props,
+              getWordsStr("guideHome_form_1"),
+              categoryList.getKey("name")
+            )
+          }
+          accessoryRight={ForwardIcon}
+          style={styles.menuItem}
+          onPress={() => {}}
+        />
+        <MenuItem
+          title={props =>
+            Label(props, getWordsStr("guideHome_form_2"), address)
+          }
+          accessoryRight={ForwardIcon}
+          style={styles.menuItem}
+          onPress={() =>
+            showChange("address", address, getWordsStr("guideHome_form_2"))
+          }
+        />
+        <MenuItem
+          title={props => Label(props, getWordsStr("guideHome_form_3"), phone)}
+          accessoryRight={ForwardIcon}
+          style={styles.menuItem}
+          onPress={() =>
+            showChange(
+              "phone",
+              phone,
+              getWordsStr("guideHome_form_3"),
+              11,
+              "phone"
+            )
+          }
+        />
+        <MenuItem
+          title={props =>
+            Label(props, getWordsStr("guideHome_form_4"), openTime)
+          }
+          accessoryRight={ForwardIcon}
+          style={styles.menuItem}
+          onPress={() => {}}
+        />
+        <MenuItem
+          title={getWordsStr("guideHome_form_5")}
+          accessoryRight={ForwardIcon}
+          style={styles.menuItem}
+          onPress={() => {
+            RootNavigation.navigate("EditBanner", {
+              type: "qualification",
+            });
+          }}
+        />
+      </Menu>
+    </Layout>
+  );
 }

screens/OrderScreen.js

@@ -1,15 +1,9 @@
 import * as WebBrowser from "expo-web-browser";
 import * as React from "react";
-import {  StyleSheet } from "react-native";
+import { StyleSheet } from "react-native";
 import { setModel, useModel } from "flooks";
-import { useFocusEffect} from "@react-navigation/native";
-import {
-    Layout,
-    Button,
-    TabBar,
-    Tab,
-    useTheme,
-} from "@ui-kitten/components";
+import { useFocusEffect } from "@react-navigation/native";
+import { Layout, Button, TabBar, Tab, useTheme } from "@ui-kitten/components";
 import NavHeaderBar from "../components/NavHeaderBar";
 import OrderCard from "../components/OrderCard";
 import ListComponent from "../components/ListComponent";
@@ -21,122 +15,135 @@ import orderInfoModel from "../models/orderInfoModel";
 
 const orderStatus = ["NOT_RECEIVED", "RECEIVED", "REJECTED", "COMPLETED"];
 
-
 const styles = StyleSheet.create({
-    tabBack: {
-        backgroundColor: "#eee",
-        borderWidth: 0,
-    },
-    indicatorStyle: {
-        backgroundColor: "#FFC21C",
-    },
-    buttonGroup: {
-        justifyContent: "center",
-        paddingVertical: 7,
-        flexDirection: "row",
-        backgroundColor: "#eee",
-    },
-    separatorStyle: {
-        height: 0,
-    },
-    list: {
-        flex: 1,
-        backgroundColor: "#eee",
-        marginTop: 10,
-    },
-    label: {
-        backgroundColor: "#eee",
-    },
+  tabBack: {
+    backgroundColor: "#eee",
+    borderWidth: 0,
+  },
+  indicatorStyle: {
+    backgroundColor: "#FFC21C",
+  },
+  buttonGroup: {
+    justifyContent: "center",
+    paddingVertical: 7,
+    flexDirection: "row",
+    backgroundColor: "#eee",
+  },
+  separatorStyle: {
+    height: 0,
+  },
+  list: {
+    flex: 1,
+    backgroundColor: "#eee",
+    marginTop: 10,
+  },
+  label: {
+    backgroundColor: "#eee",
+  },
 });
 
+export default function OrderScreen({ navigation }) {
+  const {
+    NOT_RECEIVED,
+    RECEIVED,
+    REJECTED,
+    COMPLETED,
+    tab2,
+    orderTitleBtn2,
+  } = useModel("wordsModel");
 
-export default function OrderScreen() {
-    const {
-        NOT_RECEIVED,
-        RECEIVED,
-        REJECTED,
-        COMPLETED,
-        tab2,
-        orderTitleBtn2,
-    } = useModel("wordsModel");
+  const { automaticOrder, updateMerchant } = useModel("userModel");
+  const { success } = useModel("loadingModel");
 
-    const { automaticOrder, updateMerchant } = useModel("userModel");
+  const theme = useTheme();
 
-    const theme = useTheme();
+  setModel("orderInfoModel", orderInfoModel);
+  const { getOrderList } = useModel("orderInfoModel");
+  const [startState, changeStart] = React.useState(false);
+  const [selectedIndex, setSelectedIndex] = React.useState(0);
+  const { changeBackground } = useModel("barModel");
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
+      setSelectedIndex(0);
+      changeStart(true);
+    }, [])
+  );
+  const orderItem = ({ item }) => (
+    <OrderCard
+      style={{ marginHorizontal: 10, marginBottom: 15 }}
+      appearance="classification"
+      key={item.id}
+      info={item}
+      updateInfo={() => {
+        changeStart(true);
+      }}
+    />
+  );
 
-    setModel("orderInfoModel", orderInfoModel);
-    const { getOrderList } = useModel("orderInfoModel");
-    const [startState, changeStart] = React.useState(false);
-    const [selectedIndex, setSelectedIndex] = React.useState(0);
-    const { changeBackground } = useModel("barModel");
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-            setSelectedIndex(0);
-            changeStart(true);
-        }, [])
-    );
-    const orderItem = ({ item }) => (
-      <OrderCard
-        style={{ marginHorizontal: 10, marginBottom: 15 }}
-        appearance='classification'
-        key={item.id}
-        info={item}
-        updateInfo={() => {
-                changeStart(true);
-            }}
-      />
-    );
+  function getList(page, size) {
+    const query = {
+      merchantStatus: orderStatus[selectedIndex],
+    };
+    return getOrderList(page, size, query).then(res => {
+      changeStart(false);
+      return Promise.resolve(res);
+    });
+  }
 
-    function getList(page, size) {
-        const query = {
-            merchantStatus: orderStatus[selectedIndex],
-        };
-        return getOrderList(page, size, query).then(res => {
-            changeStart(false);
-            return Promise.resolve(res);
-        });
-    }
-
-    return (
-      <>
-        <Layout style={[styles.tabBack, { flex: 1 }]}>
-          <NavHeaderBar title={tab2} />
-          <Layout style={styles.buttonGroup}>
-            <Button
-              style={{ marginRight: 10 }}
-              onPress={() =>
-                            updateMerchant({ automaticOrder: !automaticOrder })}
-            >
-              {automaticOrder ? "手动接单" : "自动接单"}
-            </Button>
-            <Button appearance='outline'>{orderTitleBtn2}</Button>
-          </Layout>
-          <TabBar
-            selectedIndex={selectedIndex}
-            indicatorStyle={styles.indicatorStyle}
-            style={styles.label}
-            onSelect={index => {
-                        setSelectedIndex(index);
-                        changeStart(true);
-                    }}
+  return (
+    <>
+      <Layout style={[styles.tabBack, { flex: 1 }]}>
+        <NavHeaderBar title={tab2} />
+        <Layout style={styles.buttonGroup}>
+          <Button
+            style={{ marginRight: 10 }}
+            appearance={automaticOrder ? "outline" : "fill"}
+            onPress={() =>
+              updateMerchant({
+                automaticOrder: !automaticOrder,
+              }).then(() => {
+                success("设置成功");
+              })
+            }
           >
-            <Tab appearance='homeTab' title={NOT_RECEIVED} />
-            <Tab appearance='homeTab' title={RECEIVED} />
-            <Tab appearance='homeTab' title={REJECTED} />
-            <Tab appearance='homeTab' title={COMPLETED} />
-          </TabBar>
-
-          <ListComponent
-            initialNumToRender={3}
-            getInfo={getList}
-            renderItem={orderItem}
-            style={styles.list}
-            separatorStyle={styles.separatorStyle}
-            showEmpty
-            startState={startState}
-          />
+            {automaticOrder ? "手动接单" : "自动接单"}
+          </Button>
+          <Button
+            appearance="outline"
+            status="success"
+            onPress={() => {
+              navigation.navigate("OrderSetting");
+            }}
+          >
+            {orderTitleBtn2}
+          </Button>
         </Layout>
-      </>
-    );
+        <TabBar
+          selectedIndex={selectedIndex}
+          indicatorStyle={styles.indicatorStyle}
+          style={styles.label}
+          onSelect={index => {
+            setSelectedIndex(index);
+            changeStart(true);
+          }}
+        >
+          <Tab appearance="homeTab" title={NOT_RECEIVED} />
+          <Tab appearance="homeTab" title={RECEIVED} />
+          <Tab appearance="homeTab" title={REJECTED} />
+          <Tab appearance="homeTab" title={COMPLETED} />
+        </TabBar>
+
+        <ListComponent
+          initialNumToRender={3}
+          getInfo={getList}
+          renderItem={orderItem}
+          style={styles.list}
+          separatorStyle={styles.separatorStyle}
+          showEmpty
+          startState={startState}
+        />
+      </Layout>
+    </>
+  );
 }

screens/UserScreen.js

@@ -1,234 +1,232 @@
 import * as WebBrowser from "expo-web-browser";
 import * as React from "react";
+import { StyleSheet } from "react-native";
 import {
-    StyleSheet,
-} from "react-native";
-import {
-    Layout,
-    useTheme,
-    Button,
-    Icon,
-    Menu,
-    MenuItem,
-    MenuGroup,
+  Layout,
+  useTheme,
+  Button,
+  Icon,
+  Menu,
+  MenuItem,
+  MenuGroup,
 } from "@ui-kitten/components";
 import { useModel } from "flooks";
 import { useFocusEffect } from "@react-navigation/native";
 import NavHeaderBar from "../components/NavHeaderBar";
 
-
-
 const ForwardIcon = props => (
   <Icon
     {...props}
-    name='arrow-ios-forward'
-    fill='#B4B4B4'
+    name="arrow-ios-forward"
+    fill="#B4B4B4"
     style={{ width: 15, height: 15, fontWeight: 500 }}
   />
 );
 
 const styles = StyleSheet.create({
-    container: {
-        backgroundColor: "#EEEEEE",
-        flex: 1,
-    },
-    menu: {
-        flex: 1,
-        backgroundColor: "#EEEEEE",
-        marginBottom: 50,
-    },
-    menuItem: { marginVertical: 3 },
-    menuGroup: {
-        marginTop: 3,
-    },
-    menuGroup2: {
-        marginTop: 6,
-    },
-    loginOut: {
-        position: "absolute",
-        bottom: 10,
-        left: 20,
-        right: 20,
-    },
+  container: {
+    backgroundColor: "#EEEEEE",
+    flex: 1,
+  },
+  menu: {
+    flex: 1,
+    backgroundColor: "#EEEEEE",
+    marginBottom: 50,
+  },
+  menuItem: { marginVertical: 3 },
+  menuGroup: {
+    marginTop: 3,
+  },
+  menuGroup2: {
+    marginTop: 6,
+  },
+  loginOut: {
+    position: "absolute",
+    bottom: 10,
+    left: 20,
+    right: 20,
+  },
 });
 
 export default function UserScreen({ navigation }) {
-    const theme = useTheme();
-    const { changeBackground } = useModel("barModel");
-    const {
-        closeMer,
-        isOpening,
-    } = useModel("userModel");
+  const theme = useTheme();
+  const { changeBackground } = useModel("barModel");
+  const { closeMer, isOpening } = useModel("userModel");
 
-    const {
-        tab3,
-        userTitle1,
-        userTitle2,
-        userTitle3,
-        userTitle4,
-        userTitle5,
-        userTitle6,
-        userTitle31,
-        userTitle32,
-        // userTitle33,
-        userTitle34,
-        userTitle41,
-        userTitle42,
-        userTitle61,
-        userTitle62,
-        userTitle21,
-        // userTitle22,
-        userTitle23,
-        userTitle24,
-    } = useModel("wordsModel");
+  const {
+    tab3,
+    userTitle1,
+    userTitle2,
+    userTitle3,
+    userTitle4,
+    userTitle5,
+    userTitle6,
+    userTitle31,
+    userTitle32,
+    userTitle33,
+    userTitle34,
+    userTitle41,
+    userTitle42,
+    userTitle61,
+    userTitle62,
+    userTitle21,
+    // userTitle22,
+    userTitle23,
+    userTitle24,
+  } = useModel("wordsModel");
 
-    useFocusEffect(
-        React.useCallback(() => {
-            changeBackground(theme["color-primary-500"]);
-        }, [])
-    );
+  useFocusEffect(
+    React.useCallback(() => {
+      changeBackground(theme["color-primary-500"]);
+    }, [])
+  );
 
-    return (
-      <>
-        <NavHeaderBar title={tab3} back={false} />
+  return (
+    <>
+      <NavHeaderBar title={tab3} back={false} />
 
-        <Layout style={styles.container} level='1'>
-          <Menu style={styles.menu}>
+      <Layout style={styles.container} level="1">
+        <Menu style={styles.menu}>
+          <MenuItem
+            title={userTitle1}
+            accessoryRight={ForwardIcon}
+            style={styles.menuItem}
+            onPress={() => {
+              navigation.navigate("Home", {
+                screen: "homeTab3",
+              });
+            }}
+          />
+          <MenuGroup title={userTitle2} style={styles.menuGroup}>
+            <MenuItem
+              title={userTitle21}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("FullReduction");
+              }}
+            />
+            {/* <MenuItem
+              title={userTitle22}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("AddClassification", {
+                  type: "signboard",
+                });
+              }}
+            /> */}
+            <MenuItem
+              title={userTitle23}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("FirstOrder");
+              }}
+            />
+            <MenuItem
+              title={userTitle24}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("CouponList");
+              }}
+            />
+          </MenuGroup>
+          <MenuGroup title={userTitle3} style={styles.menuGroup2}>
+            <MenuItem
+              title={userTitle31}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("EditGoods");
+              }}
+            />
+            <MenuItem
+              title={userTitle32}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("ClassificationManage");
+              }}
+            />
+            <MenuItem
+              title={userTitle33}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("AddClassification", {
+                  type: "signboard",
+                });
+              }}
+            />
+            <MenuItem
+              title={userTitle34}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("AddClassification", {
+                  type: "recommend",
+                });
+              }}
+            />
+          </MenuGroup>
+          <MenuGroup title={userTitle4} style={styles.menuGroup2}>
+            <MenuItem
+              title={userTitle41}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("OrderSetting");
+              }}
+            />
+            <MenuItem
+              title={userTitle42}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("OrderSetting");
+              }}
+            />
+          </MenuGroup>
+          <MenuGroup title={userTitle5} style={styles.menuGroup2}>
             <MenuItem
-              title={userTitle1}
+              title="自动回复"
               accessoryRight={ForwardIcon}
-              style={styles.menuItem}
               onPress={() => {
-                            navigation.navigate("Home", {
-                                screen: "homeTab3",
-                            });
-                        }}
+                navigation.navigate("Automatic");
+              }}
             />
-            <MenuGroup title={userTitle2} style={styles.menuGroup}>
-              <MenuItem
-                title={userTitle21}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("FullReduction");
-                            }}
-              />
-              {/* <MenuItem
-                                title={userTitle22}
-                                accessoryRight={ForwardIcon}
-                                onPress={() => {
-                                    navigation.navigate("ClassificationManage");
-                                }}
-                            /> */}
-              <MenuItem
-                title={userTitle23}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("FirstOrder");
-                            }}
-              />
-              <MenuItem
-                title={userTitle24}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("CouponList");
-                            }}
-              />
-            </MenuGroup>
-            <MenuGroup title={userTitle3} style={styles.menuGroup2}>
-              <MenuItem
-                title={userTitle31}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("EditGoods");
-                            }}
-              />
-              <MenuItem
-                title={userTitle32}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("ClassificationManage");
-                            }}
-              />
-              {/* <MenuItem
-                                title={userTitle33}
-                                accessoryRight={ForwardIcon}
-                                onPress={() => {
-                                    navigation.navigate("ClassificationManage");
-                                }}
-                            /> */}
-              <MenuItem
-                title={userTitle34}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("AddClassification");
-                            }}
-              />
-            </MenuGroup>
-            <MenuGroup title={userTitle4} style={styles.menuGroup2}>
-              <MenuItem
-                title={userTitle41}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("OrderSetting");
-                            }}
-              />
-              <MenuItem
-                title={userTitle42}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("OrderSetting");
-                            }}
-              />
-            </MenuGroup>
-            <MenuGroup title={userTitle5} style={styles.menuGroup2}>
-              <MenuItem
-                title='自动回复'
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("Automatic");
-                            }}
-              />
-              <MenuItem
-                title='我的投诉'
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("Complaintlist");
-                            }}
-              />
-            </MenuGroup>
-            <MenuGroup title={userTitle6} style={styles.menuGroup2}>
-              <MenuItem
-                title={userTitle61}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("Money");
-                            }}
-              />
-              <MenuItem
-                title={userTitle62}
-                accessoryRight={ForwardIcon}
-                onPress={() => {
-                                navigation.navigate("Bank");
-                            }}
-              />
-            </MenuGroup>
+            <MenuItem
+              title="我的投诉"
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("Complaintlist");
+              }}
+            />
+          </MenuGroup>
+          <MenuGroup title={userTitle6} style={styles.menuGroup2}>
+            <MenuItem
+              title={userTitle61}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("Money");
+              }}
+            />
+            <MenuItem
+              title={userTitle62}
+              accessoryRight={ForwardIcon}
+              onPress={() => {
+                navigation.navigate("Bank");
+              }}
+            />
+          </MenuGroup>
 
-            {/* <MenuGroup title='Akveo React Native'>
+          {/* <MenuGroup title='Akveo React Native'>
                             <MenuItem title='UI Kitten' />
                             <MenuItem title='Kitten Tricks' />
                         </MenuGroup> */}
-          </Menu>
+        </Menu>
 
-          <Layout style={styles.loginOut}>
-            <Button
-              appearance={isOpening ? "outline" : "fill"}
-              onPress={closeMer}
-            >
-              {isOpening ? "停止营业" : "开始营业"}
-            </Button>
-          </Layout>
+        <Layout style={styles.loginOut}>
+          <Button
+            appearance={isOpening ? "outline" : "fill"}
+            onPress={closeMer}
+          >
+            {isOpening ? "停止营业" : "开始营业"}
+          </Button>
         </Layout>
-      </>
-    );
+      </Layout>
+    </>
+  );
 }
-