项目结构搭建

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1 @@
+dist/*

.eslintrc.js

@@ -0,0 +1,30 @@
+module.exports = {
+  root: true,
+  globals: { wx: true },
+  parser: 'babel-eslint',
+  parserOptions: {
+    sourceType: 'module'
+  },
+  env: {
+    browser: true
+  },
+  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
+  extends: 'standard',
+  // required to lint *.wpy files
+  plugins: [
+    'html'
+  ],
+  settings: {
+    'html/html-extensions': ['.html', '.wpy']
+  },
+  // add your custom rules here
+  'rules': {
+    // allow paren-less arrow functions
+    'arrow-parens': 0,
+    // allow async-await
+    'generator-star-spacing': 0,
+    // allow debugger during development
+    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+    'space-before-function-paren': 0
+  }
+}

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+.DS_Store

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}

.wepyignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+.DS_Store
+*.wpy___jb_tmp___

package.json

@@ -0,0 +1,47 @@
+{
+  "name": "y",
+  "version": "0.0.2",
+  "description": "A WePY project",
+  "main": "dist/app.js",
+  "scripts": {
+    "dev": "wepy build -w",
+    "build": "cross-env NODE_ENV=production wepy build --no-cache",
+    "dev:web": "wepy build --output web",
+    "clean": "find ./dist -maxdepth 1 -not -name 'project.config.json' -not -name 'dist' | xargs rm -rf",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "wepy": {
+    "module-a": false,
+    "./src/components/list": "./src/components/wepy-list.wpy"
+  },
+  "author": "Limengbo <15600099705@163.com>",
+  "license": "MIT",
+  "dependencies": {
+    "redux": "^3.7.2",
+    "redux-actions": "^2.2.1",
+    "redux-promise": "^0.5.3",
+    "wepy-redux": "^1.5.3",
+    "wepy": "^1.6.0",
+    "wepy-async-function": "^1.4.4",
+    "wepy-com-toast": "^1.0.2"
+  },
+  "devDependencies": {
+    "babel-eslint": "^7.2.1",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-plugin-transform-export-extensions": "^6.22.0",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-env": "^1.6.1",
+    "cross-env": "^5.1.3",
+    "eslint": "^3.18.0",
+    "eslint-config-standard": "^7.1.0",
+    "eslint-friendly-formatter": "^2.0.7",
+    "eslint-plugin-html": "^2.0.1",
+    "eslint-plugin-promise": "^3.5.0",
+    "eslint-plugin-standard": "^2.0.1",
+    "wepy-eslint": "^1.5.3",
+    "less": "^3.8.1",
+    "wepy-compiler-babel": "^1.5.1",
+    "wepy-compiler-less": "^1.3.10"
+  }
+}

project.config.json

@@ -0,0 +1,13 @@
+{
+  "description": "A WePY project",
+  "setting": {
+    "urlCheck": true,
+    "es6": false,
+    "postcss": false,
+    "minified": false
+  },
+  "compileType": "miniprogram",
+  "appid": "touristappid",
+  "projectname": "y",
+  "miniprogramRoot": "./dist"
+}

src/app.wpy

@@ -0,0 +1,76 @@
+<style lang="less">
+page {
+  width: 100%;
+  height: 100%;
+}
+
+.container {
+  height: 100%;
+  box-sizing: border-box;
+}
+</style>
+
+<script>
+import wepy from 'wepy'
+import 'wepy-async-function'
+
+import { setStore } from 'wepy-redux'
+import configStore from './store'
+
+const store = configStore()
+setStore(store)
+
+export default class extends wepy.app {
+  config = {
+    pages: [
+      'pages/index',
+      'pages/detail'
+    ],
+    window: {
+      backgroundTextStyle: 'light',
+      navigationBarBackgroundColor: '#8397FF',
+      navigationBarTitleText: '智能共享白板',
+      navigationBarTextStyle: '#fff'
+    }
+  }
+
+  globalData = {
+    userInfo: null
+  }
+
+  constructor () {
+    super()
+    this.use('requestfix')
+  }
+
+  onLaunch() {
+    this.testAsync()
+  }
+
+  sleep (s) {
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        resolve('promise resolved')
+      }, s * 1000)
+    })
+  }
+
+  async testAsync () {
+    const data = await this.sleep(3)
+    console.log(data)
+  }
+
+  getUserInfo(cb) {
+    const that = this
+    if (this.globalData.userInfo) {
+      return this.globalData.userInfo
+    }
+    wepy.getUserInfo({
+      success (res) {
+        that.globalData.userInfo = res.userInfo
+        cb && cb(res.userInfo)
+      }
+    })
+  }
+}
+</script>

src/components/allFile.wpy

@@ -0,0 +1,83 @@
+<style lang="less">
+.all-file {
+  width: 100%;
+  padding: 0 18rpx;
+  box-sizing:border-box;
+}
+.file-item {
+  width: 100%;
+  height: 140rpx;
+  border-bottom: 2rpx solid #F0F0F0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  image {
+    width: 44rpx;
+    height: 10rpx;
+  }
+  .file {
+    display: flex;
+    image {
+      width:80rpx;
+      height: 76rpx;
+      margin-right: 26rpx;
+    }
+    .file-explain {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      .title {
+        font-size:28rpx;
+        font-weight: bolder;
+      }
+      .time {
+        font-size: 24rpx;
+        color: #909090;
+      }
+    }
+  }
+}
+</style>
+<template>
+  <view class="all-file">
+      <repeat for="{{fileList}}" key="index" index="index" item="item">
+        <view class="file-item" @tap="detail">
+          <view class="file">
+            <image src="../static/img/file.png"></image>
+            <view class="file-explain">
+              <text class="title">双十一，庆功会讨论</text>
+              <text class="time">2018-10-11 10:00</text>
+            </view>
+          </view>
+          <image src="../static/img/dian.png"></image>
+        </view>
+      </repeat>
+  </view>
+</template>
+<script>
+  import wepy from 'wepy'
+
+  export default class AllFile extends wepy.component {
+    data = {
+      fileList: [
+        {
+          id: '0',
+          title: 'loading'
+        },
+        {
+          id: '0',
+          title: 'loading'
+        }
+      ]
+    }
+
+    methods = {
+      detail () {
+        this.$root.$navigate('/pages/detail')
+      }
+    }
+
+    onLoad () {
+    }
+  }
+</script>

src/components/browse.wpy

@@ -0,0 +1,28 @@
+<style lang="less">
+</style>
+<template>
+  <view class="my">
+    浏览文件
+  </view>
+</template>
+<script>
+  import wepy from 'wepy'
+
+  export default class Browse extends wepy.component {
+    data = {
+      list: [
+        {
+          id: '0',
+          title: 'loading'
+        }
+      ]
+    }
+
+    methods = {
+
+    }
+
+    onLoad () {
+    }
+  }
+</script>

src/components/mys.wpy

@@ -0,0 +1,168 @@
+<style lang="less">
+  .my {
+    width: 100%;
+    height: 90%;
+    background: #F0F0F0;
+    padding-top: 10rpx;
+    box-sizing: border-box;
+  }
+  .user {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 200rpx;
+    background: #fff;
+    padding: 0 39rpx;
+    box-sizing: border-box;
+    margin-bottom:  10rpx;
+    image {
+      width:110rpx;
+      height: 110rpx;
+      border-radius: 50%;
+    }
+    .con {
+      display: flex;
+      flex-direction: column;
+      margin-left: 20rpx;
+      .name {
+        display: flex;
+        align-items: center;
+        font-size: 28rpx;
+        image {
+          width: 40rpx;
+          height: 20rpx;
+          border-radius: 0;
+          margin-left: 12rpx;
+        }
+      }
+      .progress-bar {
+        position: relative;
+        width:540rpx;
+        height: 14rpx;
+        background: #F2F2F2;
+        border-radius: 14rpx;
+        margin: 14rpx 0;
+        overflow: hidden;
+        .top {
+          position: absolute;
+          left: 0;
+          top: 0;
+          height: 100%;
+          width: 30%;
+          background: #F25557;
+        }
+      }
+      .capacity {
+          font-size: 24rpx;
+          color:#5B5B5B;
+      }
+    }
+  }
+  .other {
+    width: 100%;
+    height: 81%;
+    background: #fff;
+    padding: 0 62rpx;
+    box-sizing: border-box;
+    .other-item {
+      width: 100%;
+      height: 140rpx;
+      border-bottom: 2rpx solid #F0F0F0;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .txt {
+          font-size: 28rpx;
+          image {
+            width: 60rpx;
+            height: 60rpx;
+            vertical-align: middle;
+            margin-right: 17rpx;
+          }
+          text {
+            vertical-align: middle;
+          }
+          .bold {
+            font-size:32rpx;
+            font-weight: bolder;
+          }
+      }
+      .order {
+        width:100rpx;
+        height:40rpx;
+        background:rgba(216,30,6,1);
+        border-radius:5rpx;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 24rpx;
+        color: #fff;
+      }
+    }
+    .guanggao {
+      width: 100%;
+      height: 185rpx;
+      image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+</style>
+<template>
+  <view class="my">
+    <view class="user">
+      <image src="../static/img/vip.png"></image>
+      <view class="con">
+        <view class="name">
+          <text>孙志雷</text>
+          <image src="../static/img/vip.png"></image>
+        </view>
+        <view class="progress-bar">
+          <view class="top"></view>
+        </view>
+        <view class="capacity">容量（1.96G/3.4G）</view>
+      </view>
+    </view>
+    <view class="other">
+      <view class="other-item">
+        <view class="txt">
+          <image src="../static/img/time.png"></image>
+          <text class="bold">会员到期时间：</text>
+          <text>2018-12-02</text>
+        </view>
+        <view class="order">续订</view>
+      </view>
+      <view class="other-item">
+        <view class="txt">
+          <image src="../static/img/del.png"></image>
+          <text class="bold">回收站</text>
+        </view>
+      </view>
+      <view class="guanggao">
+        <image src="../static/img/guanggao.png"></image>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+  import wepy from 'wepy'
+
+  export default class Mys extends wepy.component {
+    data = {
+      list: [
+        {
+          id: '0',
+          title: 'loading'
+        }
+      ]
+    }
+
+    methods = {
+
+    }
+
+    onLoad () {
+    }
+  }
+</script>

src/index.template.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="format-detection" content="telephone=no">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta content="telephone=no" name="format-detection">
+
+  <title>转 WEB DEMO</title>
+  <style>
+      html, body, #app {height: 100%;}
+  </style>
+</head>
+<body>
+  <div id="app">
+    <router-view></router-view>
+    <script src="./index.js"></script>
+  </div>
+</body>
+</html>

src/mixins/test.js

@@ -0,0 +1,21 @@
+import wepy from 'wepy'
+
+export default class testMixin extends wepy.mixin {
+  data = {
+    mixin: 'This is mixin data.'
+  }
+  methods = {
+    tap () {
+      this.mixin = 'mixin data was changed'
+      console.log('mixin method tap')
+    }
+  }
+
+  onShow() {
+    console.log('mixin onShow')
+  }
+
+  onLoad() {
+    console.log('mixin onLoad')
+  }
+}

src/pages/detail.wpy

@@ -0,0 +1,145 @@
+<style lang="less">
+  .container {
+    width: 100%;
+    height: 100%;
+    background: #F6F7F9;
+  }
+  .file-box {
+    width: 100%;
+    background: #fff;
+    padding: 0 59rpx 0 35rpx;
+    box-sizing: border-box;
+  }
+  .file-title {
+    height: 80rpx;
+    width: 100%;
+    font-size: 32rpx;
+    line-height: 80rpx;
+    color: #848993;
+    margin-left: 33rpx;
+  }
+  .file-item {
+    width: 100%;
+    height: 140rpx;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    image {
+      width: 44rpx;
+      height: 10rpx;
+    }
+    .file {
+      display: flex;
+      image {
+        width:74rpx;
+        height: 76rpx;
+        margin-right: 26rpx;
+      }
+      .file-explain {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        .title {
+          font-size:28rpx;
+          font-weight: bolder;
+        }
+        .time {
+          font-size: 24rpx;
+          color: #909090;
+        }
+      }
+    }
+  }
+  .back {
+    position: fixed;
+    left: 40rpx;
+    bottom: 32rpx;
+    width:77rpx;
+    height: 76rpx;
+    image {
+      width: 100%;
+      height: 100%;
+    }
+  }
+</style>
+<template>
+  <view class="container">
+    <view class="file-title">文档资料</view>
+    <view class="file-box">
+      <repeat for="{{fileList}}" key="index" index="index" item="item">
+        <view class="file-item">
+          <view class="file">
+            <image src="../static/img/EXCEL.png"></image>
+            <view class="file-explain">
+              <text class="title">双十一，庆功会讨论</text>
+              <text class="time">2018-10-11 10:00</text>
+            </view>
+          </view>
+          <image src="../static/img/dian.png"></image>
+        </view>
+      </repeat>
+    </view>
+    <view class="file-title">白板截图</view>
+    <view class="file-box">
+      <repeat for="{{fileList}}" key="index" index="index" item="item">
+        <view class="file-item">
+          <view class="file">
+            <image src="../static/img/EXCEL.png"></image>
+            <view class="file-explain">
+              <text class="title">双十一，庆功会讨论</text>
+              <text class="time">2018-10-11 10:00</text>
+            </view>
+          </view>
+          <image src="../static/img/dian.png"></image>
+        </view>
+      </repeat>
+    </view>
+    <view class="back" @tap="back">
+      <image src="../static/img/back.png"></image>
+    </view>
+  </view>
+</template>
+
+<script>
+  import wepy from 'wepy'
+
+  export default class Detail extends wepy.page {
+    components = {
+
+    }
+
+    data = {
+      fileList: [
+        {
+          id: '0',
+          title: 'loading'
+        },
+        {
+          id: '0',
+          title: 'loading'
+        }
+      ]
+    }
+
+    computed = {
+
+    }
+
+    methods = {
+      back () {
+        this.$redirect({
+          url: './index'
+        })
+      }
+    }
+
+    events = {
+    }
+
+    onLoad() {
+      wepy.setNavigationBarTitle({
+        title: '当前页面'
+      })
+    }
+  }
+</script>

src/pages/index.wpy

@@ -0,0 +1,89 @@
+<style lang="less">
+  .tabar {
+    display: flex;
+    align-items:center;
+    width: 100%;
+    height: 110rpx;
+    border-bottom: 2rpx solid #F0F0F0;
+    font-size: 32rpx;
+    .tabar-list {
+      flex:1;
+      text-align: center;
+      position: relative;
+    }
+    .select {
+      color: #3687FF;
+    }
+    .heng {
+      width: 20%;
+      position: absolute;
+      left: 50%;
+      bottom: -20rpx;
+      transform:translate(-50%);
+      border-bottom: 4rpx solid #3687FF;
+    }
+  }
+</style>
+<template>
+  <view class="container">
+    <view class="tabar">
+      <repeat for="{{tab}}" key="index" >
+        <view class="tabar-list {{selectInd == index ? 'select' : ''}}" @tap="select({{index}})">
+          {{item}}
+          <view class="heng" wx:if="{{selectInd == index}}"></view>
+        </view>
+      </repeat>
+    </view>
+    <allFile wx:if="{{selectInd == 0}}"/>
+    <browse wx:if="{{selectInd == 1}}"/>
+    <my wx:if="{{selectInd == 2}}"/>
+  </view>
+</template>
+
+<script>
+  import wepy from 'wepy'
+  // import { connect } from 'wepy-redux'
+  // import moduleA from 'module-a' // aliasFields ignore module example
+  // import testMixin from '../mixins/test'
+  /* 引入组件 */
+  import Mys from '../components/mys'
+  import AllFile from '../components/allFile'
+  import Browse from '../components/browse'
+
+  export default class Index extends wepy.page {
+    config = {
+      navigationBarTitleText: '智能共享白板'
+    }
+    components = {
+      my: Mys,
+      allFile: AllFile,
+      browse: Browse
+    }
+
+    // mixins = [testMixin]
+
+    data = {
+      tab: ['全部文件', '最近浏览', '我'],
+      selectInd: 0
+    }
+
+    computed = {
+
+    }
+
+    watch = {
+    }
+
+    methods = {
+      select (ind) {
+        this.selectInd = ind
+      }
+    }
+
+    events = {
+    }
+
+    onLoad() {
+    }
+  }
+</script>

src/store/actions/counter.js

@@ -0,0 +1,10 @@
+import { ASYNC_INCREMENT } from '../types/counter'
+import { createAction } from 'redux-actions'
+
+export const asyncInc = createAction(ASYNC_INCREMENT, () => {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve(1)
+    }, 1000)
+  })
+})

src/store/actions/index.js

@@ -0,0 +1 @@
+export * from './counter'

src/store/index.js

@@ -0,0 +1,8 @@
+import { createStore, applyMiddleware } from 'redux'
+import promiseMiddleware from 'redux-promise'
+import rootReducer from './reducers'
+
+export default function configStore () {
+  const store = createStore(rootReducer, applyMiddleware(promiseMiddleware))
+  return store
+}

src/store/reducers/counter.js

@@ -0,0 +1,27 @@
+import { handleActions } from 'redux-actions'
+import { INCREMENT, DECREMENT, ASYNC_INCREMENT } from '../types/counter'
+
+export default handleActions({
+  [INCREMENT] (state) {
+    return {
+      ...state,
+      num: state.num + 1
+    }
+  },
+  [DECREMENT] (state) {
+    return {
+      ...state,
+      num: state.num - 1
+    }
+  },
+  [ASYNC_INCREMENT] (state, action) {
+    return {
+      ...state,
+      asyncNum: state.asyncNum + action.payload
+    }
+  }
+}, {
+  num: 0,
+  asyncNum: 0
+
+})

src/store/reducers/index.js

@@ -0,0 +1,6 @@
+import { combineReducers } from 'redux'
+import counter from './counter'
+
+export default combineReducers({
+  counter
+})

src/store/types/counter.js

@@ -0,0 +1,5 @@
+export const INCREMENT = 'INCREMENT'
+
+export const DECREMENT = 'DECREMENT'
+
+export const ASYNC_INCREMENT = 'ASYNC_INCREMENT'

src/store/types/index.js

@@ -0,0 +1 @@
+export * from './counter'

wepy.config.js

@@ -0,0 +1,73 @@
+const path = require('path')
+var prod = process.env.NODE_ENV === 'production'
+
+module.exports = {
+  wpyExt: '.wpy',
+  eslint: true,
+  cliLogs: !prod,
+  build: {
+    web: {
+      htmlTemplate: path.join('src', 'index.template.html'),
+      htmlOutput: path.join('web', 'index.html'),
+      jsOutput: path.join('web', 'index.js')
+    }
+  },
+  resolve: {
+    alias: {
+      counter: path.join(__dirname, 'src/components/counter'),
+      '@': path.join(__dirname, 'src')
+    },
+    aliasFields: ['wepy', 'weapp'],
+    modules: ['node_modules']
+  },
+  compilers: {
+    less: {
+      compress: prod
+    },
+    /* sass: {
+      outputStyle: 'compressed'
+    }, */
+    babel: {
+      sourceMap: true,
+      presets: [
+        'env'
+      ],
+      plugins: [
+        'transform-class-properties',
+        'transform-decorators-legacy',
+        'transform-object-rest-spread',
+        'transform-export-extensions'
+      ]
+    }
+  },
+  plugins: {
+  },
+  appConfig: {
+    noPromiseAPI: ['createSelectorQuery']
+  }
+}
+
+if (prod) {
+  // 压缩sass
+  // module.exports.compilers['sass'] = {outputStyle: 'compressed'}
+
+  // 压缩js
+  module.exports.plugins = {
+    uglifyjs: {
+      filter: /\.js$/,
+      config: {
+      }
+    },
+    imagemin: {
+      filter: /\.(jpg|png|jpeg)$/,
+      config: {
+        jpg: {
+          quality: 80
+        },
+        png: {
+          quality: 80
+        }
+      }
+    }
+  }
+}