静态页面

project.config.json

@@ -5,30 +5,30 @@
 	"appid": "wx1d9348230d6a0da6",
 	"setting": {
 		"urlCheck": true,
-		"scopeDataCheck": false,
-		"coverView": true,
 		"es6": false,
+		"enhance": false,
 		"postcss": false,
-		"compileHotReLoad": false,
 		"preloadBackgroundData": false,
 		"minified": false,
-		"autoAudits": false,
 		"newFeature": false,
-		"uglifyFileName": false,
-		"uploadWithSourceMap": true,
-		"useIsolateContext": true,
+		"coverView": true,
 		"nodeModules": false,
-		"enhance": false,
-		"useCompilerModule": false,
-		"userConfirmedUseCompilerModuleSwitch": false,
+		"autoAudits": false,
 		"showShadowRootInWxmlPanel": true,
+		"scopeDataCheck": false,
+		"uglifyFileName": false,
 		"checkInvalidKey": true,
 		"checkSiteMap": true,
+		"uploadWithSourceMap": true,
+		"compileHotReLoad": false,
 		"babelSetting": {
 			"ignore": [],
 			"disablePlugins": [],
 			"outputPath": ""
-		}
+		},
+		"useIsolateContext": true,
+		"useCompilerModule": false,
+		"userConfirmedUseCompilerModuleSwitch": false
 	},
 	"compileType": "miniprogram",
 	"simulatorType": "wechat",

src/app.config.js

@@ -1,10 +1,20 @@
 export default {
   pages: [
-    'pages/WoDe/index',
-    'pages/ShouYe/index',
-    'pages/WuYe/index',
-    'pages/HuoDong/index',
-    'pages/FuLi/index',
+    'pages/WuYe/TianJiaBaoXiu/index', // 物业-添加报修
+    'pages/ShouYe/index', // tab-首页
+    'pages/ShouYe/HuoDong/index', // 首页-活动
+    'pages/ShouYe/ZiXun/index', // 首页-资讯
+
+    'pages/WuYe/index', // tab-物业
+    'pages/WuYe/FuWuDetail/index', // 物业-服务详情
+    'pages/WuYe/GongGaoDetail/index', // 物业-公告详情
+    'pages/WuYe/BaoXiuQuYu/index', // 物业-报修区域
+
+    'pages/HuoDong/index', // tab-活动
+
+    'pages/FuLi/index', // tab-福利
+
+    'pages/WoDe/index', // tab-我的
   ],
   tabBar: {
     color: '#666666',

src/components/WuYeFuWuItem/index.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import Taro from '@tarojs/taro'
 import '../../assets/css/reset.less'
 import '../../assets/css/iconfont.less'
 import './index.less'
@@ -22,7 +23,7 @@ export default class WuYeFuWuItem extends Component {
   render () {
     const { TestImg } = this.state
     return (
-      <view className='WuYeFuWuItem flex-h'>
+      <view className='WuYeFuWuItem flex-h' onClick={() => { Taro.navigateTo({ url: '/pages/WuYe/FuWuDetail/index' }) }}>
         <view className='Img'>
           <image mode='aspectFill' src={TestImg} className='centerLabel'></image>
         </view>

src/components/WuYeGongGaoItem/index.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import Taro from '@tarojs/taro'
 import '../../assets/css/reset.less'
 import '../../assets/css/iconfont.less'
 import './index.less'
@@ -17,7 +18,7 @@ export default class WuYeGongGaoItem extends Component {
 
   render () {
     return (
-      <view className='WuYeGongGaoItem'>
+      <view className='WuYeGongGaoItem' onClick={() => { Taro.navigateTo({ url: '/pages/WuYe/GongGaoDetail/index?id=1' }) }}>
         <view className='Title flex-h'>
           <text className='flex-item'>处理绿化带种菜公告</text>
           <text>2020/06/08</text>

src/pages/ShouYe/HuoDong/index.config.js

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '活动'
+}

src/pages/ShouYe/HuoDong/index.css

@@ -0,0 +1,20 @@
+.ShouYeHuoDong {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background: #f8f8f8;
+}
+.ShouYeHuoDong .ShouYeHuoDongContent {
+  position: relative;
+  overflow: hidden;
+  padding: 0 30px;
+}
+.ShouYeHuoDong .ShouYeHuoDongContent > .ListItem {
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+  margin-bottom: 30px;
+}
+.ShouYeHuoDong .ShouYeHuoDongContent > .ListItem:first-child {
+  margin-top: 30px;
+}

src/pages/ShouYe/HuoDong/index.jsx

@@ -0,0 +1,54 @@
+import React, { Component } from 'react'
+import ActivityListItem from '../../../components/ActivityListItem/index'
+import '../../../assets/css/reset.less'
+import '../../../assets/css/iconfont.less'
+import './index.less'
+
+export default class ShouYeHuoDong extends Component {
+
+  state = {
+    ActivityList: ['', '', '', '', '', '', '', ''],
+    IsPull: false
+  }
+
+  componentWillMount () { }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  OnRefresh () { // 页面下拉刷新
+    this.setState({
+      IsPull: true
+    }, () => {
+      window.setTimeout(() => {
+        this.setState({
+          IsPull: false
+        })
+      }, 1000)
+    })
+  }
+
+  render () {
+    const { IsPull, ActivityList } = this.state
+    return (
+      <view className='ShouYeHuoDong'>
+        <scroll-view scroll-y='true' style='height: 100%;' refresher-enabled={true} onrefresherrefresh={this.OnRefresh.bind(this)} refresher-triggered={IsPull} refresher-background='none'>
+          <view className='ShouYeHuoDongContent'>
+            {
+              ActivityList.map((item, index) => (
+                <view className='ListItem' key={`ActivityItem-${index}`}>
+                  <ActivityListItem Data={item}></ActivityListItem>
+                </view>
+              ))
+            }
+          </view>
+        </scroll-view>
+      </view >
+    )
+  }
+}

src/pages/ShouYe/HuoDong/index.less

@@ -0,0 +1,20 @@
+.ShouYeHuoDong {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background: #f8f8f8;
+  .ShouYeHuoDongContent {
+    position: relative;
+    overflow: hidden;
+    padding: 0 30px;
+    >.ListItem {
+      width: 100%;
+      position: relative;
+      overflow: hidden;
+      margin-bottom: 30px;
+      &:first-child {
+        margin-top: 30px;
+      }
+    }
+  }
+}

src/pages/ShouYe/ZiXun/index.config.js

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '资讯'
+}

src/pages/ShouYe/ZiXun/index.css

@@ -0,0 +1,20 @@
+.ShouYeZiXun {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background: #f8f8f8;
+}
+.ShouYeZiXun .ShouYeHuoDongContent {
+  position: relative;
+  overflow: hidden;
+  padding: 0 30px;
+}
+.ShouYeZiXun .ShouYeHuoDongContent > .ListItem {
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+  margin-bottom: 30px;
+}
+.ShouYeZiXun .ShouYeHuoDongContent > .ListItem:first-child {
+  margin-top: 30px;
+}

src/pages/ShouYe/ZiXun/index.jsx

@@ -0,0 +1,54 @@
+import React, { Component } from 'react'
+import NewsListItem from '../../../components/NewsListItem/index'
+import '../../../assets/css/reset.less'
+import '../../../assets/css/iconfont.less'
+import './index.less'
+
+export default class ShouYeZiXun extends Component {
+
+  state = {
+    ActivityList: ['', '', '', '', '', '', '', ''],
+    IsPull: false
+  }
+
+  componentWillMount () { }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  OnRefresh () { // 页面下拉刷新
+    this.setState({
+      IsPull: true
+    }, () => {
+      window.setTimeout(() => {
+        this.setState({
+          IsPull: false
+        })
+      }, 1000)
+    })
+  }
+
+  render () {
+    const { IsPull, ActivityList } = this.state
+    return (
+      <view className='ShouYeZiXun'>
+        <scroll-view scroll-y='true' style='height: 100%;' refresher-enabled={true} onrefresherrefresh={this.OnRefresh.bind(this)} refresher-triggered={IsPull} refresher-background='none'>
+          <view className='ShouYeHuoDongContent'>
+            {
+              ActivityList.map((item, index) => (
+                <view className='ListItem' key={`ActivityItem-${index}`}>
+                  <NewsListItem Data={item} ShowTips={index === 0}></NewsListItem>
+                </view>
+              ))
+            }
+          </view>
+        </scroll-view>
+      </view >
+    )
+  }
+}

src/pages/ShouYe/ZiXun/index.less

@@ -0,0 +1,20 @@
+.ShouYeZiXun {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background: #f8f8f8;
+  .ShouYeHuoDongContent {
+    position: relative;
+    overflow: hidden;
+    padding: 0 30px;
+    >.ListItem {
+      width: 100%;
+      position: relative;
+      overflow: hidden;
+      margin-bottom: 30px;
+      &:first-child {
+        margin-top: 30px;
+      }
+    }
+  }
+}

src/pages/ShouYe/index.jsx

@@ -1,6 +1,7 @@
 import React, { Component } from 'react'
 import NavHeader from '../../components/NavHeader/index'
 import { Swiper, SwiperItem, Text } from '@tarojs/components'
+import Taro from '@tarojs/taro'
 import '../../assets/css/reset.less'
 import '../../assets/css/iconfont.less'
 import './index.less'
@@ -23,10 +24,10 @@ export default class Index extends Component {
       { icon: 'iconrenzheng', name: '业主认证', id: 4 }
     ],
     NavList: [
-      { icon: 'iconhuodong1', name: '活动', id: 1 },
-      { icon: 'iconfuli', name: '福利', id: 2 },
-      { icon: 'iconfuwu', name: '服务', id: 3 },
-      { icon: 'iconxinwen', name: '资讯', id: 4 }
+      { icon: 'iconhuodong1', name: '活动', id: 1, router: '/pages/ShouYe/HuoDong/index', isTab: false },
+      { icon: 'iconfuli', name: '福利', id: 2, router: '/pages/FuLi/index', isTab: true },
+      { icon: 'iconfuwu', name: '服务', id: 3, router: '/pages/WuYe/index', isTab: true },
+      { icon: 'iconxinwen', name: '资讯', id: 4, router: '/pages/ShouYe/ZiXun/index', isTab: false }
     ],
     TestImg: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1606120989360&di=8610f1678b51e26de6d4c6af39d1cf63&imgtype=0&src=http%3A%2F%2Fattachments.gfan.com%2Fforum%2F201503%2F19%2F211608ztcq7higicydxhsy.jpg',
     BannerList: [
@@ -48,6 +49,16 @@ export default class Index extends Component {
 
   componentDidHide () { }
 
+  NavClick (item) {
+    return () => {
+      if (item.isTab) {
+        Taro.switchTab({ url: item.router })
+      } else {
+        Taro.navigateTo({ url: item.router })
+      }
+    }
+  }
+
   OnRefresh () { // 页面下拉刷新
     this.setState({
       IsPull: true
@@ -77,7 +88,7 @@ export default class Index extends Component {
 
           {/* 正文 */}
           <view className='PageContainer'>
-            <scroll-view scroll-y='true' style='height: 100%;' refresher-enabled={true} onrefresherrefresh={this.OnRefresh.bind(this)} refresher-triggered={IsPull} refresher-background='none'>
+            <scroll-view scroll-y='true' style='height: 100%;' refresher-enabled={true} onrefresherrefresh={this.OnRefresh.bind(this)} refresher-triggered={IsPull} refresher-background='#f35844'>
               <view className='Content'>
 
                 {/* 背景图 */}
@@ -112,7 +123,7 @@ export default class Index extends Component {
                     {
                       NavList.map((item, index) => (
                         <view key={`Nav-${index}`} className='flex-item'>
-                          <view>
+                          <view onClick={this.NavClick(item)}>
                             <view className='centerLabel'>
                               <Text className={`iconfont ${item.icon}`}></Text>
                               <Text>{item.name}</Text>
@@ -127,8 +138,8 @@ export default class Index extends Component {
                   <view className='HotActivityContainer'>
                     <view>
                       <view className='Title'>
-                        <Text>热门活动</Text>
-                        <Text className='iconfont icongengduo'></Text>
+                        <Text onClick={() => { Taro.navigateTo({ url: '/pages/ShouYe/HuoDong/index' }) }}>热门活动</Text>
+                        <Text className='iconfont icongengduo' onClick={() => { Taro.navigateTo({ url: '/pages/ShouYe/HuoDong/index' }) }}></Text>
                       </view>
                       <view className='Activity'>
                         <image className='centerLabel' mode='aspectFill' src={TestImg}></image>
@@ -160,7 +171,7 @@ export default class Index extends Component {
                     <view>
                       <view className='Title flex-h'>
                         <Text className='flex-item'>热门资讯</Text>
-                        <Text>查看全部</Text>
+                        <Text onClick={() => { Taro.navigateTo({ url: '/pages/ShouYe/ZiXun/index' }) }}>查看全部</Text>
                         <Text className='iconfont iconjiantouright'></Text>
                       </view>
                       <view className='List'>

src/pages/WuYe/BaoXiuQuYu/index.config.js

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '报修区域'
+}

src/pages/WuYe/BaoXiuQuYu/index.css

@@ -0,0 +1,50 @@
+.WuYeBaoXiuQuYu {
+  width: 100%;
+  position: relative;
+  background: #f8f8f8;
+  overflow: hidden;
+  min-height: 100%;
+}
+.WuYeBaoXiuQuYu > view {
+  padding: 0 30px;
+  margin-bottom: 30px;
+  position: relative;
+  overflow: hidden;
+}
+.WuYeBaoXiuQuYu > view:first-child {
+  margin-top: 30px;
+}
+.WuYeBaoXiuQuYu > view > view {
+  padding: 60px 0;
+  position: relative;
+  overflow: hidden;
+  background-color: #fff;
+  border-radius: 12px;
+}
+.WuYeBaoXiuQuYu > view > view > view {
+  font-size: 0;
+  white-space: nowrap;
+  text-align: center;
+}
+.WuYeBaoXiuQuYu > view > view > view > text {
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 32px;
+  color: #333;
+  font-weight: bold;
+  line-height: 60px;
+}
+.WuYeBaoXiuQuYu > view > view > view > text:first-child {
+  font-weight: normal;
+  font-size: 40px;
+  color: #F35844;
+  margin-right: 20px;
+}
+.WuYeBaoXiuQuYu > view > view > text {
+  display: block;
+  font-size: 24px;
+  color: #999;
+  line-height: 40px;
+  text-align: center;
+  margin-top: 20px;
+}

src/pages/WuYe/BaoXiuQuYu/index.jsx

@@ -0,0 +1,48 @@
+import React, { Component } from 'react'
+import Taro from '@tarojs/taro'
+import '../../../assets/css/reset.less'
+import '../../../assets/css/iconfont.less'
+import './index.less'
+
+export default class WuYeBaoXiuQuYu extends Component {
+
+  state = {
+    TypeList: [
+      { icon: 'icongonggongquyu', name: '公共区域问题', desc: '如绿植被破坏、楼道灯不亮等问题', id: 1 },
+      { icon: 'iconfangwuzhiliang', name: '房屋质量问题', desc: '如家中墙体开裂、墙皮脱落等问题', id: 2 },
+      { icon: 'iconhuneisheshi', name: '户内设施问题', desc: '如通浴室下水道、保洁等可能需要收费的项目', id: 3 }
+    ]
+  }
+
+  componentWillMount () {
+  }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    const { TypeList } = this.state
+    return (
+      <view className='WuYeBaoXiuQuYu'>
+        {
+          TypeList.map((item, index) => (
+            <view key={`WuYeBaoXiuQuYu-${index}`}>
+              <view onClick={() => { Taro.navigateTo({ url: `/pages/WuYe/TianJiaBaoXiu/index?type=${item.id}` }) }}>
+                <view>
+                  <text className={`iconfont ${item.icon}`}></text>
+                  <text>{item.name}</text>
+                </view>
+                <text>{item.desc}</text>
+              </view>
+            </view>
+          ))
+        }
+      </view>
+    )
+  }
+}

src/pages/WuYe/BaoXiuQuYu/index.less

@@ -0,0 +1,56 @@
+.WuYeBaoXiuQuYu {
+  width: 100%;
+  position: relative;
+  background: #f8f8f8;
+  overflow: hidden;
+  min-height: 100%;
+
+  >view {
+    padding: 0 30px;
+    margin-bottom: 30px;
+    position: relative;
+    overflow: hidden;
+
+    &:first-child {
+      margin-top: 30px;
+    }
+
+    >view {
+      padding: 60px 0;
+      position: relative;
+      overflow: hidden;
+      background-color: #fff;
+      border-radius: 12px;
+
+      >view {
+        font-size: 0;
+        white-space: nowrap;
+        text-align: center;
+
+        >text {
+          display: inline-block;
+          vertical-align: middle;
+          font-size: 32px;
+          color: #333;
+          font-weight: bold;
+          line-height: 60px;
+
+          &:first-child {
+            font-weight: normal;
+            font-size: 40px;
+            color: #F35844;
+            margin-right: 20px;
+          }
+        }
+      }
+      >text {
+        display: block;
+        font-size: 24px;
+        color: #999;
+        line-height: 40px;
+        text-align: center;
+        margin-top: 20px;
+      }
+    }
+  }
+}

src/pages/WuYe/FuWuDetail/index.config.js

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '服务详情'
+}

src/pages/WuYe/FuWuDetail/index.css

@@ -0,0 +1,6 @@
+.WuYeFuWuDetail {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background: #f8f8f8;
+}

src/pages/WuYe/FuWuDetail/index.jsx

@@ -0,0 +1,29 @@
+import React, { Component } from 'react'
+import '../../../assets/css/reset.less'
+import '../../../assets/css/iconfont.less'
+import './index.less'
+
+export default class WuYeFuWuDetail extends Component {
+
+  state = {
+  }
+
+  componentWillMount () {
+  }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    return (
+      <view className='WuYeFuWuDetail'>
+
+      </view>
+    )
+  }
+}

src/pages/WuYe/FuWuDetail/index.less

@@ -0,0 +1,6 @@
+.WuYeFuWuDetail {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background: #f8f8f8;
+}

src/pages/WuYe/GongGaoDetail/index.config.js

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '公告详情'
+}

src/pages/WuYe/GongGaoDetail/index.css

@@ -0,0 +1,6 @@
+.WuYeGongGaoDetail {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background: #f8f8f8;
+}

src/pages/WuYe/GongGaoDetail/index.jsx

@@ -0,0 +1,33 @@
+import React, { Component } from 'react'
+import '../../../assets/css/reset.less'
+import '../../../assets/css/iconfont.less'
+import './index.less'
+
+export default class WuYeGongGaoDetail extends Component {
+
+  state = {
+  }
+
+  componentWillMount () {
+  }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+  
+  onLoad (opt) {
+    console.log(opt.id)
+  }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    return (
+      <view className='WuYeGongGaoDetail'>
+
+      </view>
+    )
+  }
+}

src/pages/WuYe/GongGaoDetail/index.less

@@ -0,0 +1,6 @@
+.WuYeGongGaoDetail {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background: #f8f8f8;
+}

src/pages/WuYe/TianJiaBaoXiu/index.config.js

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '添加报修'
+}

src/pages/WuYe/TianJiaBaoXiu/index.css

@@ -0,0 +1,7 @@
+.WuYeTianJiaBaoXiu {
+  width: 100%;
+  position: relative;
+  background: #f8f8f8;
+  overflow: hidden;
+  min-height: 100%;
+}

src/pages/WuYe/TianJiaBaoXiu/index.jsx

@@ -0,0 +1,30 @@
+import React, { Component } from 'react'
+// import Taro from '@tarojs/taro'
+import '../../../assets/css/reset.less'
+import '../../../assets/css/iconfont.less'
+import './index.less'
+
+export default class WuYeTianJiaBaoXiu extends Component {
+
+  state = {
+  }
+
+  componentWillMount () {
+  }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    return (
+      <view className='WuYeTianJiaBaoXiu'>
+
+      </view>
+    )
+  }
+}

src/pages/WuYe/TianJiaBaoXiu/index.less

@@ -0,0 +1,7 @@
+.WuYeTianJiaBaoXiu {
+  width: 100%;
+  position: relative;
+  background: #f8f8f8;
+  overflow: hidden;
+  min-height: 100%;
+}

src/pages/WuYe/index.jsx

@@ -22,7 +22,8 @@ export default class WuYe extends Component {
     IsPull: false
   }
 
-  componentWillMount () { }
+  componentWillMount () {
+  }
 
   componentDidMount () { }