init

.env

@@ -0,0 +1 @@
+REMAX_APP_BASE_URL=https://example.com/api

.gitignore

@@ -0,0 +1,4 @@
+node_modules/
+dist/
+yarn-error.log
+yarn.lock

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 80,
+  "semi": true,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "requirePragma": false,
+  "proseWrap": "preserve",
+  "singleQuote": true
+}

README.md

@@ -0,0 +1,26 @@
+# 垃圾分类小程序
+
+
+## 开始开发
+
+安装依赖
+
+```bash
+$ npm install
+```
+
+开始构建
+
+```bash
+$ npm run dev
+```
+
+使用微信小程序开发者工具打开项目目录。
+
+## 发布
+
+```bash
+$ npm run build
+```
+
+使用微信小程序开发者工具上传版本。

package.json

@@ -0,0 +1,27 @@
+{
+  "name": "rubbish",
+  "private": true,
+  "version": "1.0.0",
+  "main": "index.js",
+  "keywords": [],
+  "license": "MIT",
+  "scripts": {
+    "dev": "remax build -t wechat -w",
+    "build": "NODE_ENV=production remax build -t wechat",
+    "clean": "rimraf dist",
+    "prebuild": "npm run clean"
+  },
+  "dependencies": {
+    "@vant/weapp": "^1.2.1",
+    "react": "^16.12.0",
+    "remax": "^1.9.0"
+  },
+  "devDependencies": {
+    "@types/react": "^16.9.16",
+    "chokidar": "^3.3.0",
+    "node-sass": "^4.13.1",
+    "remax-cli": "^1.9.0",
+    "rimraf": "^3.0.0",
+    "typescript": "^3.7.3"
+  }
+}

project.config.json

@@ -0,0 +1,28 @@
+{
+	"miniprogramRoot": "dist/",
+	"setting": {
+		"urlCheck": false,
+		"es6": false,
+		"postcss": true,
+		"minified": true,
+		"newFeature": true,
+		"coverView": true,
+		"autoAudits": false,
+		"uglifyFileName": false,
+		"checkInvalidKey": true,
+		"checkSiteMap": true,
+		"uploadWithSourceMap": true,
+		"babelSetting": {
+			"ignore": [],
+			"disablePlugins": [],
+			"outputPath": ""
+		},
+		"bundle": false
+	},
+	"compileType": "miniprogram",
+	"simulatorType": "wechat",
+	"simulatorPluginLibVersion": {},
+	"appid": "wx925532d3bbc3e3c4",
+	"projectname": "rubbish-minapp",
+	"condition": {}
+}

src/api/index.ts

@@ -0,0 +1,3 @@
+import api from '../libs/request';
+
+export const login = () => api.get('login');

src/app.config.ts

@@ -0,0 +1,13 @@
+import { AppConfig } from 'remax/wechat';
+
+const config: AppConfig = {
+  pages: ['pages/index/index'],
+  window: {
+    navigationBarTitleText: '垃圾分类',
+    navigationBarBackgroundColor: '#ffffff',
+    backgroundTextStyle: 'dark',
+    navigationBarTextStyle: 'black',
+  },
+};
+
+export default config;

src/app.scss

@@ -0,0 +1,4 @@
+page,
+view {
+  box-sizing: border-box;
+}

src/app.tsx

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import './app.scss';
+
+const App: React.FC = props => props.children as React.ReactElement;
+
+export default App;

src/libs/bxios.ts

@@ -0,0 +1,157 @@
+interface IRequestConfig {
+  [key: string]: any;
+  timeout?: number;
+  reqState?: boolean;
+  url?: string;
+  header?: any;
+  data?: string;
+  method?: string;
+  dataType?: string;
+  baseUrl?: string;
+}
+
+export class Bxios {
+  public interceptors: {
+    request: InterceptorManager;
+    response: InterceptorManager;
+  };
+
+  private defaults: IRequestConfig = {
+    timeout: 5000,
+    reqState: false,
+    url: '',
+    header: {
+      tenantId: '',
+      token: '',
+    },
+    data: '',
+    method: '',
+    dataType: 'json',
+    baseUrl: '',
+    success: null,
+    fail: null,
+    complete: null,
+  };
+
+  constructor(defaultConfig: any = {}) {
+    this.defaults = Object.assign({}, this.defaults, defaultConfig);
+    this.interceptors = {
+      request: new InterceptorManager(),
+      response: new InterceptorManager(),
+    };
+  }
+
+  get(url: string, data?: any, config?: any) {
+    return this.request(
+      Object.assign({
+        header: Object.assign(this.defaults.header, config),
+        method: 'get',
+        data,
+        url,
+      }),
+    );
+  }
+
+  post(url: string, data?: any, config: any = {}) {
+    return this.request(
+      Object.assign({
+        header: Object.assign(this.defaults.header, config),
+        method: 'post',
+        data,
+        url,
+      }),
+    );
+  }
+
+  put(url: string, data?: any, config?: any) {
+    return this.request(
+      Object.assign({
+        header: Object.assign(this.defaults.header, config),
+        method: 'put',
+        data,
+        url,
+      }),
+    );
+  }
+
+  delete(url: string, data?: any, config?: any) {
+    return this.request(
+      Object.assign({
+        header: Object.assign(this.defaults.header, config),
+        method: 'delete',
+        data,
+        url,
+      }),
+    );
+  }
+
+  private request(config: any) {
+    const chain = [this.dispatchRequest.bind(this), undefined];
+    config.url = `${this.defaults.baseUrl}${config.url}`;
+    let promise = Promise.resolve(Object.assign(this.defaults, config));
+
+    this.interceptors.request.forEach((interceptor: any) => {
+      chain.unshift(
+        interceptor.fulfilled.bind(this, config),
+        interceptor.rejected,
+      );
+    });
+
+    this.interceptors.response.forEach((interceptor: any) => {
+      chain.push(interceptor.fulfilled, interceptor.rejected);
+    });
+    while (chain.length) {
+      promise = promise.then(chain.shift(), chain.shift());
+    }
+    return promise;
+  }
+
+  private xhrAdapter(config: any) {
+    return new Promise((resolve, reject) => {
+      wx.request(
+        Object.assign({}, config, {
+          success: (res: any) => {
+            resolve({
+              resHeader: res.header,
+              config: Object.assign(this.defaults, config),
+              data: res.data,
+            });
+          },
+          fail: (err: any) => {
+            reject(err);
+          },
+        }),
+      );
+    });
+  }
+
+  private async dispatchRequest(config: any) {
+    const adapter = this.xhrAdapter(config);
+    try {
+      return await adapter;
+    } catch (reason) {
+      return Promise.reject(reason);
+    }
+  }
+}
+
+export class InterceptorManager {
+  private handlers: any = [];
+
+  use<T = IRequestConfig>(
+    fulfilled: (conf: T) => any,
+    rejected: (res: any) => any,
+  ) {
+    this.handlers.push({
+      fulfilled,
+      rejected,
+    });
+    return this.handlers.length - 1;
+  }
+
+  forEach(fn: (arg: any) => void) {
+    this.handlers.forEach((h: any) => fn(h));
+  }
+}
+
+export default Bxios;

src/libs/request.ts

@@ -0,0 +1,27 @@
+import Bxios from "./bxios";
+
+const bxios = new Bxios({ baseUrl: "" });
+
+bxios.interceptors.request.use(
+  (conf) => {
+    return conf;
+  },
+  (err) => {
+    return Promise.reject(err);
+  }
+);
+
+bxios.interceptors.response.use<any>(
+  (res) => {
+    if (res.data.code === 200) {
+      // console.log(res.config.url, "------->", res.data.data);
+      return res.data.data;
+    }
+    return Promise.reject(res.data.msg);
+  },
+  (err) => {
+    return Promise.reject(err);
+  }
+);
+
+export default bxios;

src/pages/index/action.tsx

@@ -0,0 +1,31 @@
+import React, { useState } from 'react';
+import { View, Text } from 'remax/wechat';
+
+import VanDivider from '@vant/weapp/dist/divider/index';
+import VanImage from '@vant/weapp/dist/image/index';
+import VanButton from '@vant/weapp/dist/button/index';
+
+export default () => {
+  return (
+    <View className="action">
+      <View className="action__title">垃圾分类视频上传</View>
+      <View className="action__time">2020年4月22日 7点31分</View>
+      <VanDivider />
+      <VanImage use-error-slot width="100%" height="340rpx">
+        // @ts-ignore
+        <Text slot="error">加载失败</Text>
+      </VanImage>
+      <VanButton custom-class="action__button" type="default" block>
+        拍摄视频
+      </VanButton>
+      <View className="action__tips">
+        <View>说明：</View>
+        <View>1、每上传一个视频积1分，每天最多积2分：</View>
+        <View>2、视频限现场拍摄视频，拍摄佳可重拍、上传成功后不可撤销：</View>
+        <View>
+          3、视频可后台人员抽查，一旦发现非垃圾分类视频取消用户积分为0：
+        </View>
+      </View>
+    </View>
+  );
+};

src/pages/index/contribution.tsx

@@ -0,0 +1,6 @@
+import React, { useState } from 'react';
+import { View } from 'remax/wechat';
+
+export default () => {
+  return <View className="contribution">contribution</View>;
+};

src/pages/index/index.config.ts

@@ -0,0 +1,7 @@
+import { PageConfig } from "remax/wechat";
+
+const config: PageConfig = {
+  navigationBarTitleText: '首页'
+};
+
+export default config;

src/pages/index/index.scss

@@ -0,0 +1,54 @@
+@mixin flex($justify-content: center, $align-items: center) {
+  display: flex;
+  justify-content: $justify-content;
+  align-items: $align-items;
+}
+
+.me {
+  padding: 30rpx 20rpx;
+
+  &__top {
+    @include flex(flex-start);
+    font-size: 28rpx;
+
+    &--info {
+      margin-left: 50rpx;
+    }
+  }
+
+  &__form {
+    margin: 40rpx 0;
+  }
+}
+
+.home {
+  width: 100vw;
+  height: 100vh;
+}
+
+.action {
+  width: 100vw;
+  height: 100vh;
+  padding: 30rpx 20rpx;
+  &__title {
+    font-size: 48rpx;
+    text-align: center;
+  }
+
+  &__time {
+    font-size: 24rpx;
+    text-align: right;
+    margin-top: 20rpx;
+  }
+
+  &__button {
+    margin-top: 30rpx;
+  }
+
+  &__tips {
+    position: absolute;
+    bottom: 150px;
+    font-size: 22rpx;
+    color: #555;
+  }
+}

src/pages/index/index.tsx

@@ -0,0 +1,43 @@
+import React, { useState } from 'react';
+import { View } from 'remax/wechat';
+
+import Action from './action';
+import Contribution from './contribution';
+import Me from './me';
+
+import VanTabbar from '@vant/weapp/dist/tabbar/index';
+import VanTabbarItem from '@vant/weapp/dist/tabbar-item/index';
+
+import './index.scss';
+
+const getCurrentTab = (type: number) => {
+  switch (type) {
+    case 0:
+      return <Action />;
+    case 1:
+      return <Contribution />;
+    case 2:
+      return <Me />;
+  }
+};
+
+export default () => {
+  /** 当前tab */
+  const [active, setActive] = useState(2);
+
+  /** 设置当前tab */
+  const handleSetActive = ({ detail }: any) => {
+    setActive(detail);
+  };
+
+  return (
+    <View className="home">
+      <VanTabbar active={active} bindchange={(e: any) => handleSetActive(e)}>
+        <VanTabbarItem icon="home-o">参与行动</VanTabbarItem>
+        <VanTabbarItem icon="home-o">贡献历史</VanTabbarItem>
+        <VanTabbarItem icon="home-o">我的</VanTabbarItem>
+      </VanTabbar>
+      {getCurrentTab(active)}
+    </View>
+  );
+};

src/pages/index/me.tsx

@@ -0,0 +1,46 @@
+import React, { useState } from 'react';
+import { View } from 'remax/wechat';
+
+import VanImage from '@vant/weapp/dist/image/index';
+import VanTreeSelect from '@vant/weapp/dist/tree-select/index';
+import VanCellGroup from '@vant/weapp/dist/cell-group/index';
+import VanCell from '@vant/weapp/dist/cell/index';
+import VanField from '@vant/weapp/dist/field/index';
+import VanDivider from '@vant/weapp/dist/divider/index';
+
+export default () => {
+  return (
+    <View className="me">
+      <View className="me__top">
+        <VanImage
+          round
+          width="80px"
+          height="80px"
+          src="https://img.yzcdn.cn/vant/cat.jpeg"
+        />
+        <View className="me__top--info">
+          <View>昵称：测试</View>
+          <View>性别：男</View>
+          <View>出生日期：1999-01-01</View>
+        </View>
+      </View>
+
+      <VanDivider />
+
+      <View className="me__form">
+        <VanCellGroup title="家庭住址">
+          <VanField label="街道" value="内容" />
+          <VanField label="小区" value="内容" />
+          <VanField label="地址" value="内容" />
+        </VanCellGroup>
+      </View>
+
+      <View className="me__form">
+        <VanCellGroup title="用户信息">
+          <VanField label="联系手机" value="内容" />
+          <VanField label="充值手机" value="内容" />
+        </VanCellGroup>
+      </View>
+    </View>
+  );
+};

src/typings/global.d.ts

@@ -0,0 +1,54 @@
+declare module '@vant/weapp/dist/button/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/tabbar/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/tabbar-item/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/divider/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/image/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/row/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/col/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/cell/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/cell-group/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/tree-select/index' {
+  const src: any;
+  export default src;
+}
+
+declare module '@vant/weapp/dist/field/index' {
+  const src: any;
+  export default src;
+}

tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "strict": true,
+    "esModuleInterop": true,
+    "jsx": "preserve",
+    "rootDir": "src",
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

typings/index.d.ts

@@ -0,0 +1,10 @@
+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';