feat: --

.editorconfig

@@ -0,0 +1,12 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc.js

@@ -0,0 +1,8 @@
+module.exports = {
+  extends: ["taro/react"],
+  rules: {
+    "react/jsx-uses-react": "off",
+    "react/react-in-jsx-scope": "off",
+    "jsx-quotes": false,
+  },
+};

.gitignore

@@ -0,0 +1,6 @@
+dist/
+deploy_versions/
+.temp/
+.rn_temp/
+node_modules/
+.DS_Store

.vscode/settings.json

@@ -0,0 +1,5 @@
+{
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "typescript.tsdk": "node_modules\\typescript\\lib",
+  "editor.formatOnSave": true
+}

babel.config.js

@@ -0,0 +1,13 @@
+// babel-preset-taro 更多选项和默认值：
+// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md
+module.exports = {
+  presets: [
+    [
+      "taro",
+      {
+        framework: "react",
+        ts: true,
+      },
+    ],
+  ],
+};

config/dev.js

@@ -0,0 +1,8 @@
+module.exports = {
+  env: {
+    NODE_ENV: '"development"',
+  },
+  defineConstants: {},
+  mini: {},
+  h5: {},
+};

config/index.js

@@ -0,0 +1,68 @@
+const config = {
+  projectName: "wx-csbwg-minapp",
+  date: "2024-3-28",
+  designWidth: 750,
+  deviceRatio: {
+    640: 2.34 / 2,
+    750: 1,
+    828: 1.81 / 2,
+  },
+  sourceRoot: "src",
+  outputRoot: "dist",
+  plugins: [],
+  defineConstants: {
+    "process.env.TARO_APP_API": JSON.stringify(process.env.TARO_APP_API),
+  },
+  copy: {
+    patterns: [],
+    options: {},
+  },
+  framework: "react",
+  mini: {
+    postcss: {
+      pxtransform: {
+        enable: true,
+        config: {
+          mediaQuery: true,
+        },
+      },
+      url: {
+        enable: true,
+        config: {
+          limit: 1024, // 设定转换尺寸上限
+        },
+      },
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        config: {
+          namingPattern: "module", // 转换模式，取值为 global/module
+          generateScopedName: "[name]__[local]___[hash:base64:5]",
+        },
+      },
+    },
+  },
+  h5: {
+    publicPath: "/",
+    staticDirectory: "static",
+    postcss: {
+      autoprefixer: {
+        enable: true,
+        config: {},
+      },
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        config: {
+          namingPattern: "module", // 转换模式，取值为 global/module
+          generateScopedName: "[name]__[local]___[hash:base64:5]",
+        },
+      },
+    },
+  },
+};
+
+module.exports = function (merge) {
+  if (process.env.NODE_ENV === "development") {
+    return merge({}, config, require("./dev"));
+  }
+  return merge({}, config, require("./prod"));
+};

config/prod.js

@@ -0,0 +1,37 @@
+module.exports = {
+  env: {
+    NODE_ENV: '"production"'
+  },
+  defineConstants: {
+  },
+  mini: {},
+  h5: {
+    /**
+     * WebpackChain 插件配置
+     * @docs https://github.com/neutrinojs/webpack-chain
+     */
+    // webpackChain (chain) {
+    //   /**
+    //    * 如果 h5 端编译后体积过大，可以使用 webpack-bundle-analyzer 插件对打包体积进行分析。
+    //    * @docs https://github.com/webpack-contrib/webpack-bundle-analyzer
+    //    */
+    //   chain.plugin('analyzer')
+    //     .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, [])
+
+    //   /**
+    //    * 如果 h5 端首屏加载时间过长，可以使用 prerender-spa-plugin 插件预加载首页。
+    //    * @docs https://github.com/chrisvfritz/prerender-spa-plugin
+    //    */
+    //   const path = require('path')
+    //   const Prerender = require('prerender-spa-plugin')
+    //   const staticDir = path.join(__dirname, '..', 'dist')
+    //   chain
+    //     .plugin('prerender')
+    //     .use(new Prerender({
+    //       staticDir,
+    //       routes: [ '/pages/index/index' ],
+    //       postProcess: (context) => ({ ...context, outputPath: path.join(staticDir, 'index.html') })
+    //     }))
+    // }
+  }
+}

global.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="@tarojs/taro" />
+
+declare module '*.png';
+declare module '*.gif';
+declare module '*.jpg';
+declare module '*.jpeg';
+declare module '*.svg';
+declare module '*.css';
+declare module '*.less';
+declare module '*.scss';
+declare module '*.sass';
+declare module '*.styl';
+
+declare namespace JSX {
+    interface IntrinsicElements {
+        'import': React.DetailedHTMLProps<React.EmbedHTMLAttributes<HTMLEmbedElement>, HTMLEmbedElement>
+    }
+}
+
+declare namespace NodeJS {
+  interface ProcessEnv {
+    TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'quickapp' | 'qq' | 'jd'
+  }
+}

package.json

@@ -0,0 +1,75 @@
+{
+  "name": "wx-csbwg-minapp",
+  "version": "1.0.0",
+  "private": true,
+  "description": "无锡慈善博物馆-小程序",
+  "templateInfo": {
+    "name": "mobx",
+    "typescript": true,
+    "css": "sass"
+  },
+  "scripts": {
+    "build:weapp": "cross-env TARO_APP_API=https://sit-wuxicishan.4dage.com taro build --type weapp",
+    "build:swan": "taro build --type swan",
+    "build:alipay": "taro build --type alipay",
+    "build:tt": "taro build --type tt",
+    "build:h5": "taro build --type h5",
+    "build:rn": "taro build --type rn",
+    "build:qq": "taro build --type qq",
+    "build:quickapp": "taro build --type quickapp",
+    "dev:weapp": "cross-env TARO_APP_API=https://sit-wuxicishan.4dage.com npm run build:weapp -- --watch",
+    "dev:swan": "npm run build:swan -- --watch",
+    "dev:alipay": "npm run build:alipay -- --watch",
+    "dev:tt": "npm run build:tt -- --watch",
+    "dev:h5": "cross-env TARO_APP_API=https://sit-wuxicishan.4dage.com npm run build:h5 -- --watch",
+    "dev:rn": "npm run build:rn -- --watch",
+    "dev:qq": "npm run build:qq -- --watch",
+    "dev:quickapp": "npm run build:quickapp -- --watch"
+  },
+  "browserslist": [
+    "last 3 versions",
+    "Android >= 4.1",
+    "ios >= 8"
+  ],
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@babel/runtime": "^7.7.7",
+    "@dage/hooks": "^1.0.1",
+    "@dage/service": "^1.0.3",
+    "@tarojs/components": "3.4.9",
+    "@tarojs/plugin-framework-react": "3.4.9",
+    "@tarojs/react": "3.4.9",
+    "@tarojs/runtime": "3.4.9",
+    "@tarojs/taro": "3.4.9",
+    "async-validator": "^4.2.5",
+    "classnames": "^2.5.1",
+    "mobx": "^4.8.0",
+    "mobx-react": "^6.1.4",
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0",
+    "taro-ui": "^3.3.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.8.0",
+    "@tarojs/mini-runner": "3.4.9",
+    "@tarojs/webpack-runner": "3.4.9",
+    "@types/react": "^17.0.2",
+    "@types/sass": "1.43.1",
+    "@types/webpack-env": "^1.13.6",
+    "@typescript-eslint/eslint-plugin": "^5.20.0",
+    "@typescript-eslint/parser": "^5.20.0",
+    "babel-preset-taro": "3.4.9",
+    "cross-env": "^7.0.3",
+    "eslint": "^8.12.0",
+    "eslint-config-taro": "3.4.9",
+    "eslint-plugin-import": "^2.12.0",
+    "eslint-plugin-react": "^7.8.2",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "stylelint": "9.3.0",
+    "typescript": "^4.1.0"
+  },
+  "resolutions": {
+    "query-string": "7.1.3"
+  }
+}

project.config.json

@@ -0,0 +1,13 @@
+{
+  "miniprogramRoot": "./dist",
+  "projectname": "wx-csbwg-minapp",
+  "description": "无锡慈善博物馆-小程序",
+  "appid": "wx0bc995dace29b2ba",
+  "setting": {
+    "urlCheck": true,
+    "es6": false,
+    "postcss": false,
+    "minified": false
+  },
+  "compileType": "miniprogram"
+}

project.tt.json

@@ -0,0 +1,13 @@
+{
+  "miniprogramRoot": "./",
+  "projectname": "wx-csbwg-minapp",
+  "description": "无锡慈善博物馆-小程序",
+  "appid": "touristappid",
+  "setting": {
+    "urlCheck": true,
+    "es6": false,
+    "postcss": false,
+    "minified": false
+  },
+  "compileType": "miniprogram"
+}

src/api/index.ts

@@ -0,0 +1,62 @@
+import { requestByGet, requestByPost } from "@dage/service";
+
+export const wechatLoginApi = (code: string) => {
+  return requestByGet("/api/show/wx/login/" + code, undefined, {
+    meta: {
+      showError: true,
+    },
+  });
+};
+
+export const setUserInfoApi = (params: any) => {
+  return requestByPost("/api/cms/game/editUser", params, {
+    meta: {
+      showError: true,
+    },
+  });
+};
+
+export const checkLoginApi = () => {
+  return requestByGet("/api/show/checkLogin");
+};
+
+export const setVistorName = (name: string) => {
+  return requestByPost(`/api/show/saveNickname/${name}`);
+};
+
+export const feedbackApi = (params: any) => {
+  return requestByPost("/api/cms/game/message", params, {
+    meta: {
+      showError: true,
+      showLoading: true,
+    },
+  });
+};
+
+export const getUserPointApi = () => {
+  return requestByGet("/api/cms/game/getPoint");
+};
+
+export const getPointRecordListApi = () => {
+  return requestByGet("/api/cms/game/point/getList", undefined, {
+    meta: {
+      showLoading: true,
+    },
+  });
+};
+
+export const getProductListApi = (params: any) => {
+  return requestByPost("/api/cms/game/prize/pageList", params, {
+    meta: {
+      showLoading: true,
+    },
+  });
+};
+
+export const redeemApi = (params: any) => {
+  return requestByPost("/api/cms/game/prize/redeem", params, {
+    meta: {
+      showLoading: true,
+    },
+  });
+};

src/app.config.ts

@@ -0,0 +1,32 @@
+export default defineAppConfig({
+  pages: ["pages/login/index", "pages/home/index", "pages/temp/index"],
+  subpackages: [
+    {
+      root: "subModule",
+      pages: [
+        "pages/shopmall/index",
+        "pages/feedback/index",
+        "pages/order/index",
+      ],
+    },
+  ],
+  window: {
+    backgroundTextStyle: "light",
+    navigationBarBackgroundColor: "#fff",
+    navigationBarTitleText: "锡善云城",
+    navigationBarTextStyle: "black",
+  },
+  tabBar: {
+    list: [
+      {
+        pagePath: "pages/home/index",
+        text: "首页",
+      },
+      {
+        pagePath: "pages/temp/index",
+        text: "",
+      },
+    ],
+    custom: true,
+  },
+});

src/app.scss

@@ -0,0 +1,42 @@
+page,
+.root {
+  font-family: "Source Han Sans SC Regular";
+}
+
+.margin-safe-area-bottom {
+  margin-bottom: constant(safe-area-inset-bottom);
+  margin-bottom: env(safe-area-inset-bottom);
+}
+
+.limit-line {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  align-content: center;
+  word-break: break-all;
+  word-wrap: break-word;
+  /* autoprefixer: off */
+  -webkit-box-orient: vertical;
+}
+
+.line-2 {
+  -webkit-line-clamp: 2;
+}
+
+@font-face {
+  font-family: "Source Han Sans SC Regular";
+  src: url("https://houseoss.4dkankan.com/project/wx-csbwg-public/fonts/SourceHanSansSCRegular.otf");
+}
+@font-face {
+  font-family: "Source Han Serif CN Heavy";
+  src: url("https://houseoss.4dkankan.com/project/wx-csbwg-public/fonts/SourceHanSerifCNHeavy.otf");
+}
+@font-face {
+  font-family: "Source Han Sans CN-Bold";
+  src: url("https://houseoss.4dkankan.com/project/wx-csbwg-public/fonts/SourceHanSansSCBold.otf");
+}
+@font-face {
+  font-family: "Source Han Serif CN-Bold";
+  src: url("https://houseoss.4dkankan.com/project/wx-csbwg-public/fonts/SourceHanSerifCN-SemiBold.otf");
+}

src/app.tsx

@@ -0,0 +1,84 @@
+import Taro from "@tarojs/taro";
+import { Component } from "react";
+import { Provider } from "mobx-react";
+import { compose, initial } from "@dage/service";
+
+import store from "./store";
+import { TOKEN_KEY } from "./utils";
+import { $fetch } from "./utils/fetch";
+
+import "./app.scss";
+import "./taro-ui.scss";
+
+declare global {
+  interface DageRequestMeta {
+    showLoading?: boolean;
+    showError?: boolean;
+  }
+}
+
+initial({
+  // @ts-ignore
+  fetch: $fetch,
+  baseURL: process.env.TARO_APP_API as string,
+  interceptor: compose(
+    (request, next) => {
+      const token = Taro.getStorageSync(TOKEN_KEY);
+      if (token) {
+        request.headers["token"] = token;
+      }
+      return next();
+    },
+    async (request, next) => {
+      const { showLoading, showError } = request.meta;
+      try {
+        if (showLoading) {
+          Taro.showLoading({
+            title: "加载中...",
+          });
+        }
+
+        const response = await next();
+
+        if (showLoading && showError) {
+          Taro.hideLoading();
+        }
+
+        if (response.code !== 0) {
+          const message = response.errorMessage ?? "系统出差中";
+          response.errorMessage = message;
+          if (showError) {
+            Taro.showToast({
+              title: message,
+              icon: "none",
+              duration: 2000,
+            });
+          }
+        }
+
+        return response;
+      } finally {
+        if (showLoading && !showError) {
+          Taro.hideLoading();
+        }
+      }
+    }
+  ),
+});
+
+class App extends Component {
+  componentDidMount() {}
+
+  componentDidShow() {}
+
+  componentDidHide() {}
+
+  componentDidCatchError() {}
+
+  // this.props.children 就是要渲染的页面
+  render() {
+    return <Provider store={store}>{this.props.children}</Provider>;
+  }
+}
+
+export default App;

src/components/LoadingPage/index.scss

@@ -0,0 +1,32 @@
+.loading-page {
+  position: relative;
+  height: 100%;
+  overflow: hidden;
+  background: url("https://houseoss.4dkankan.com/project/wx-csbwg-public/images/bg_loading%402x-min.png")
+    no-repeat center center / cover;
+}
+
+.loading-main {
+  position: absolute;
+  left: 130px;
+  right: 130px;
+  bottom: 40px;
+
+  &__txt {
+    color: #ff9494;
+    text-align: center;
+    font-size: 31px;
+  }
+}
+
+.loading-progress {
+  position: relative;
+  margin-bottom: 20px;
+
+  .at-progress {
+    &__outer-inner {
+      background: rgba(0, 0, 0, 0.19);
+      border: 2rpx solid #ffffff;
+    }
+  }
+}

src/components/LoadingPage/index.tsx

@@ -0,0 +1,54 @@
+import { View } from "@tarojs/components";
+import Taro, { FC } from "@tarojs/taro";
+import { AtProgress } from "taro-ui";
+import { useEffect } from "react";
+import { usePreloader } from "../../hooks/usePreloader";
+import "./index.scss";
+
+export interface LoadingPageProps {}
+
+const getList = () => {
+  const list: string[] = [];
+
+  for (let i = 1; i <= 26; i++) {
+    list.push(
+      `https://houseoss.4dkankan.com/project/wx-csbwg-public/line-sights/${i}.png`,
+      `https://houseoss.4dkankan.com/project/wx-csbwg-public/sights/${i}.png`
+    );
+  }
+
+  return list;
+};
+
+export const LoadingPage: FC<LoadingPageProps> = () => {
+  const { start, percent } = usePreloader({
+    list: [...getList()],
+    success() {
+      setInterval(() => {
+        Taro.switchTab({
+          url: "/pages/home/index",
+        });
+      }, 500);
+    },
+  });
+
+  useEffect(() => {
+    start();
+  }, []);
+
+  return (
+    <View className="loading-page">
+      <View className="loading-main margin-safe-area-bottom">
+        <View className="loading-progress">
+          <AtProgress
+            percent={Number(percent)}
+            isHidePercent={true}
+            color="#FF8888"
+          />
+        </View>
+
+        <View className="loading-main__txt">LOADING...</View>
+      </View>
+    </View>
+  );
+};

src/hooks/useInterval.ts

@@ -0,0 +1,20 @@
+import { useEffect, useRef } from "react";
+
+export const useInterval = (callback: Function, delay: number | null) => {
+  const savedCallback = useRef<Function>();
+
+  useEffect(() => {
+    savedCallback.current = callback;
+  });
+
+  useEffect(() => {
+    function tick() {
+      savedCallback.current?.();
+    }
+
+    if (delay !== null) {
+      let id = setInterval(tick, delay);
+      return () => clearInterval(id);
+    }
+  }, [delay]);
+};

src/hooks/usePreloader.ts

@@ -0,0 +1,121 @@
+import Taro from "@tarojs/taro";
+import { useCallback, useRef, useState } from "react";
+
+export enum PRELOADER_STATUS {
+  ERROR = "error",
+  LOADING = "loading",
+  WAITING = "waiting",
+  DONE = "done",
+}
+
+const parseUrlName = (url: string) => {
+  const regex = /\/([^/]+)\.\w+$/;
+  const match = url.match(regex);
+  if (match && match.length >= 2) {
+    return match[1].split(".")[0];
+  } else {
+    return "";
+  }
+};
+
+export function usePreloader(params: {
+  list: string[];
+  /**
+   * 百分比保留几位小数
+   */
+  decimals?: number;
+  success?: Function;
+  error?: Function;
+  /**
+   * 尝试重连次数
+   * @default 3
+   */
+  retry?: number;
+}) {
+  const _list = useRef(params.list);
+  const _retry = params.retry ?? 3;
+
+  const fileSizeStack = useRef<Map<string, number>>(new Map());
+
+  /**
+   * 进度
+   */
+  const [percent, setPercent] = useState(0);
+  const [status, setStatus] = useState<PRELOADER_STATUS>(
+    PRELOADER_STATUS.WAITING
+  );
+
+  const handlePreload = (url: string, retry = _retry) => {
+    return new Promise((res, rej) => {
+      Taro.request({
+        url,
+        responseType: "arraybuffer",
+        enableChunked: true,
+      })
+        .then(() => {
+          fileSizeStack.current.set(url, 1);
+
+          if (fileSizeStack.current.size === _list.current.length) {
+            setPercent(100);
+          }
+
+          res(true);
+        })
+        .catch((err) => {
+          console.log(err);
+          if (retry) {
+            console.log("尝试重新预加载");
+            setTimeout(() => {
+              handlePreload(url, retry - 1)
+                .then(res)
+                .catch(rej);
+            }, 2000);
+          } else {
+            rej(err);
+          }
+        });
+    });
+  };
+
+  const resetParams = () => {
+    fileSizeStack.current.clear();
+    setPercent(0);
+  };
+
+  const start = () => {
+    if (status === PRELOADER_STATUS.LOADING) return;
+
+    if (status !== PRELOADER_STATUS.WAITING) {
+      resetParams();
+    }
+
+    setStatus(PRELOADER_STATUS.LOADING);
+
+    const timer = setInterval(() => {
+      if (percent < 99) {
+        setPercent((num) => num + 1);
+      } else {
+        clearInterval(timer);
+      }
+    }, 500);
+
+    Promise.all(_list.current.map((url) => handlePreload(url)))
+      .then(() => {
+        params.success?.();
+        setStatus(PRELOADER_STATUS.DONE);
+      })
+      .catch((err: Error) => {
+        params.error?.(err);
+        setStatus(PRELOADER_STATUS.ERROR);
+      })
+      .finally(() => {
+        clearInterval(timer);
+      });
+  };
+
+  return {
+    status,
+    percent,
+    start,
+  };
+}