first commit

This commit is contained in:
郑茂强 2018-11-29 17:35:49 +08:00
commit 379d337dde
23 changed files with 777 additions and 0 deletions

12
.editorconfig Normal file
View File

@ -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

8
.eslintrc Normal file
View File

@ -0,0 +1,8 @@
{
"extends": ["taro"],
"rules": {
"no-unused-vars": ["error", { "varsIgnorePattern": "Taro" }],
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx", ".tsx"] }]
},
"parser": "babel-eslint"
}

5
.gitignore vendored Normal file
View File

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

4
.npmrc Normal file
View File

@ -0,0 +1,4 @@
registry=https://r.cnpmjs.org
disturl=https://r.cnpmjs.org/node
sass_binary_site=https://r.cnpmjs.org/node-sass/
fse_binary_host_mirror=https://r.cnpmjs.org/fsevents

9
config/dev.js Normal file
View File

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

79
config/index.js Normal file
View File

@ -0,0 +1,79 @@
const config = {
projectName: 'cf-wx-app',
date: '2018-11-29',
designWidth: 750,
deviceRatio: {
'640': 2.34 / 2,
'750': 1,
'828': 1.81 / 2
},
sourceRoot: 'src',
outputRoot: 'dist',
plugins: {
babel: {
sourceMap: true,
presets: [
'env'
],
plugins: [
'transform-decorators-legacy',
'transform-class-properties',
'transform-object-rest-spread'
]
}
},
defineConstants: {
},
copy: {
patterns: [
],
options: {
}
},
weapp: {
module: {
postcss: {
autoprefixer: {
enable: true,
config: {
browsers: [
'last 3 versions',
'Android >= 4.1',
'ios >= 8'
]
}
},
pxtransform: {
enable: true,
config: {
}
},
url: {
enable: true,
config: {
limit: 10240 // 设定转换尺寸上限
}
}
}
}
},
h5: {
publicPath: '/',
staticDirectory: 'static',
module: {
postcss: {
autoprefixer: {
enable: true
}
}
}
}
}
module.exports = function (merge) {
if (process.env.NODE_ENV === 'development') {
return merge({}, config, require('./dev'))
}
return merge({}, config, require('./prod'))
}

9
config/prod.js Normal file
View File

@ -0,0 +1,9 @@
module.exports = {
env: {
NODE_ENV: '"production"'
},
defineConstants: {
},
weapp: {},
h5: {}
}

57
package.json Normal file
View File

@ -0,0 +1,57 @@
{
"name": "cf-wx-app",
"version": "1.0.0",
"private": true,
"description": "cf-wx-app",
"scripts": {
"build:weapp": "taro build --type weapp",
"build:swan": "taro build --type swan",
"build:alipay": "taro build --type alipay",
"build:h5": "taro build --type h5",
"build:rn": "taro build --type rn",
"dev:weapp": "npm run build:weapp -- --watch",
"dev:swan": "npm run build:swan -- --watch",
"dev:alipay": "npm run build:alipay -- --watch",
"dev:h5": "npm run build:h5 -- --watch",
"dev:rn": "npm run build:rn -- --watch"
},
"author": "",
"license": "MIT",
"dependencies": {
"@tarojs/async-await": "^1.2.0-beta.3",
"@tarojs/components": "^1.2.0-beta.3",
"@tarojs/redux": "^1.2.0-beta.3",
"@tarojs/redux-h5": "^1.2.0-beta.3",
"@tarojs/router": "^1.2.0-beta.3",
"@tarojs/taro": "^1.2.0-beta.3",
"@tarojs/taro-alipay": "^1.2.0-beta.3",
"@tarojs/taro-h5": "^1.2.0-beta.3",
"@tarojs/taro-swan": "^1.2.0-beta.3",
"@tarojs/taro-weapp": "^1.2.0-beta.3",
"nervjs": "^1.3.9",
"nerv-devtools": "^1.3.9",
"redux": "^4.0.0",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0"
},
"devDependencies": {
"@types/react": "^16.4.8",
"@types/webpack-env": "^1.13.6",
"@tarojs/plugin-babel": "^1.2.0-beta.3",
"@tarojs/plugin-csso": "^1.2.0-beta.3",
"@tarojs/plugin-sass": "^1.2.0-beta.3",
"@tarojs/plugin-uglifyjs": "^1.2.0-beta.3",
"@tarojs/webpack-runner": "^1.2.0-beta.3",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-jsx-stylesheet": "^0.6.5",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-eslint": "^8.2.3",
"eslint": "^4.19.1",
"eslint-config-taro": "^1.2.0-beta.3",
"eslint-plugin-react": "^7.8.2",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-taro": "^1.2.0-beta.3"
}
}

13
project.config.json Normal file
View File

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

24
src/actions/counter.js Normal file
View File

@ -0,0 +1,24 @@
import {
ADD,
MINUS
} from '../constants/counter'
export const add = () => {
return {
type: ADD
}
}
export const minus = () => {
return {
type: MINUS
}
}
// 异步的action
export function asyncAdd () {
return dispatch => {
setTimeout(() => {
dispatch(add())
}, 2000)
}
}

53
src/app.js Normal file
View File

@ -0,0 +1,53 @@
import '@tarojs/async-await'
import Taro, { Component } from '@tarojs/taro'
import { Provider } from '@tarojs/redux'
import Index from './pages/index'
import configStore from './store'
import './app.scss'
// 如果需要在 h5 环境中开启 React Devtools
// 取消以下注释:
// if (process.env.NODE_ENV !== 'production' && process.env.TARO_ENV === 'h5') {
// require('nerv-devtools')
// }
const store = configStore()
class App extends Component {
config = {
pages: [
'pages/index/index',
'pages/home/home',
],
window: {
backgroundTextStyle: 'light',
navigationBarBackgroundColor: '#fff',
navigationBarTitleText: 'WeChat',
navigationBarTextStyle: 'black'
}
}
componentDidMount () {}
componentDidShow () {}
componentDidHide () {}
componentCatchError () {}
componentDidCatchError () {}
// 在 App 类中的 render() 函数没有实际作用
// 请勿修改此函数
render () {
return (
<Provider store={store}>
<Index />
</Provider>
)
}
}
Taro.render(<App />, document.getElementById('app'))

0
src/app.scss Normal file
View File

View File

@ -0,0 +1,65 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text,Image } from '@tarojs/components'
import './recommondShop.scss'
class recommondShop extends Component {
config = {
navigationBarTitleText: 'recommondShop'
}
componentWillReceiveProps(nextProps) {
console.log(this.props, nextProps)
}
componentWillUnmount() { }
componentDidShow() { }
componentDidHide() { }
render() {
const title = this.props.shop.shop_name
const imgUrl = 'http://192.168.1.230/' + this.props.shop.shop_logo
const price = this.props.shop.goods[0].goods_price
const ProductName = this.props.shop.goods_name
const address = this.props.shop.shop_address
const distance = this.props.shop.distance
return (
<View className='shop-list-box'>
<View className='header'>
<View className='title'>
{title}
</View>
<View className='ask-button'>
<Button>咨询</Button>
</View>
</View>
<View className='body'>
<View className='shop-img'>
<Image
src={imgUrl}
/>
</View>
<View className='details'>
<View><Text>商品:{ProductName}</Text> </View>
<View><Text>价格:{price}</Text></View>
</View>
</View>
<View className='footer'>
<View className='address'><Text>{address}</Text> </View>
<View className='distance'><Text>{distance}</Text></View>
</View>
</View>
)
}
}
export default recommondShop

View File

@ -0,0 +1,53 @@
.shop-list-box{
border: 1px solid #ddd;
border-radius: 3px;
box-shadow: 0 5px 5px #ddd;
margin-bottom: 10px;
.header{
border-bottom:gray solid 1px;
display: flex;
.title{
width: 50%;
color: #333;
font-weight: bold;
}
.ask-button{
width: 50%;
button{
background-color: #337ab7;
height: 36px;
width:24px;
color:white
}
}
}
.body{
border-bottom:gray solid 1px;
display: flex;
font-size: 35px;
.shop-img{
padding: 20px;
Image{
height: 200px;
width: 200px;
}
}
.details{
View{
margin-top: 20px;
}
}
}
.footer{
display: flex;
.distance{
width: 50%;
font-size: 30px
}
.address{
width:50%;
font-size: 30px
}
}
}

2
src/constants/counter.js Normal file
View File

@ -0,0 +1,2 @@
export const ADD = 'ADD'
export const MINUS = 'MINUS'

19
src/index.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="width=device-width,initial-scale=1,user-scalable=no" name="viewport">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="format-detection" content="telephone=no,address=no">
<meta name="apple-mobile-web-app-status-bar-style" content="white">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
<title>Taro</title>
<script>
!function(x){function w(){var v,u,t,tes,s=x.document,r=s.documentElement,a=r.getBoundingClientRect().width;if(!v&&!u){var n=!!x.navigator.appVersion.match(/AppleWebKit.*Mobile.*/);v=x.devicePixelRatio;tes=x.devicePixelRatio;v=n?v:1,u=1/v}if(a>=640){r.style.fontSize="40px"}else{if(a<=320){r.style.fontSize="20px"}else{r.style.fontSize=a/320*20+"px"}}}x.addEventListener("resize",function(){w()});w()}(window);
</script>
</head>
<body>
<div id="app"></div>
</body>
</html>

216
src/pages/home/home.js Normal file
View File

@ -0,0 +1,216 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text, Swiper, SwiperItem, Image } from '@tarojs/components'
import { connect } from '@tarojs/redux'
import recommondShop from '../../component/recommendShop/recommendShop'
import { add, minus, asyncAdd } from '../../actions/counter'
import './home.scss'
@connect(({ counter }) => ({
counter
}), (dispatch) => ({
add () {
dispatch(add())
},
dec () {
dispatch(minus())
},
asyncAdd () {
dispatch(asyncAdd())
}
}))
class Home extends Component {
config = {
navigationBarTitleText: '首页'
}
constructor(){
this.state={
shops:'',
ads:'',
categories:'',
demanding:''
}
}
//http://ihome6.com/Shop-supplyShops
componentDidMount(){
this.getShopInfo()
this.getHomePageInfo()
}
componentWillReceiveProps (nextProps) {
//console.log(this.props, nextProps)
}
componentWillUnmount () { }
componentDidShow () { }
componentDidHide () { }
getHomePageInfo(){
Taro.request({
url: 'http://192.168.1.230/Shop-wxStore',
})
.then(res =>{
// console.log(res.data)
this.setState({
ads: res.data.data.adsLb,
categories: res.data.data.supplyClass,
categories: res.data.data.supplyClass,
demanding: res.data.data.demand.supplys,
}, () => {
console.log(this.state.demanding)
})})
}
getShopInfo(){
Taro.request({
url: 'http://192.168.1.230/Shop-supplyShops',
method: 'POST',
dataType: 'json',
data: {
param: JSON.stringify({
curr_page: 1,
page_count: 20,
parent_supply_class: 1,
supply_class: 1,
supply_level: 1,
action: "2"
})
},
header: {
'content-type': 'application/x-www-form-urlencoded'
}
})
.then(res => {
this.setState({ shops: res.data.shops })
}
)
}
render () {
const demandingElemensArray = this.state.demanding.map((item,index)=>{
return <SwiperItem key={item.toString()} key={index}>
<View className='customer-need-item'>
<View className='item-title'>
{item.class_name}
</View>
<View className='item-address'>
软件园D区
</View>
<View className='item-name'>
业主{item.user_name}
</View>
<View className='item-button'>
<Button>{item.state_name}</Button>
</View>
</View>
</SwiperItem>
})
const shopCollectionElementsArray=this.state.shops.map((item,index)=>{
return <recommondShop test='1111111' shop={item} key={index}></recommondShop>
})
const adsImgElementsArray=this.state.ads.map((item,index)=>{
return <SwiperItem key={index}>
<Image src={'http://192.168.1.230/' + item.ads_pic}/>
</SwiperItem>
})
const categoriesElementsArray1=this.state.categories[0].map((item,index)=>{
return <View className='category-item' key={index}>
<View> <Image style='height: 42px;width: 42px;' className='cate-img' src={'http://192.168.1.230/' + item.icon} /></View>
<View>{item.class_name}</View>
</View>
})
const categoriesElementsArray2=this.state.categories[1].map((item,index)=>{
return <View className='category-item' key={index}>
<View> <Image style='height: 42px;width: 42px;' className='cate-img' src={'http://192.168.1.230/' + item.icon} /></View>
<View>{item.class_name}</View>
</View>
})
return (
<View className='home'>
<View className='top-banner'>
<Swiper
className='test-h'
indicatorColor='#999'
indicatorActiveColor='#333'
hotizontal
circular
indicatorDots
autoplay>
{adsImgElementsArray}
</Swiper>
</View>
<View className='main-cate'>
<Swiper
className='categories-box'
indicatorColor='#999'
indicatorActiveColor='#333'
hotizontal
circular
indicatorDots
autoplay>
<SwiperItem>
<View className='categories'>
{categoriesElementsArray1}
</View>
</SwiperItem>
<SwiperItem>
<View className='categories'>
{categoriesElementsArray2}
</View>
</SwiperItem>
</Swiper>
</View>
<View className='container'>
<View className='title'>
<View className='text'>
业主需求
</View>
<View className='more-link'>
更多>>
</View>
</View>
<View className='customer-need'>
<Swiper
className='test-h'
indicatorColor='#999'
indicatorActiveColor='#333'
horizontal
circular
displayMultipleItems='4'
autoplay>
{demandingElemensArray}
</Swiper>
</View>
<View className='sub-cate'>
</View>
<View className='title'>
行业推荐
</View>
<View className='demanding'>
{shopCollectionElementsArray}
</View>
</View>
</View>
)
}
}
export default Home

33
src/pages/home/home.scss Normal file
View File

@ -0,0 +1,33 @@
.container{
margin-top: 100px;
.title{
display: flex;
flex-wrap: nowrap;
flex-direction: row;
.text{
width: 50% ;
flex:1;
}
.more-link{
width: 50% ;
flex:1;
text-align: right
}
}
.demand{
font-size: 30px;
}
}
.main-cate{
.categories{
display: flex;
flex-wrap: wrap;
flex-direction: row;
text-align: center;
font-size:30px;
.category-item{
width: 20%;
margin-top: 20px;
}
}
}

60
src/pages/index/index.js Normal file
View File

@ -0,0 +1,60 @@
import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components'
import { connect } from '@tarojs/redux'
import { add, minus, asyncAdd } from '../../actions/counter'
import './index.scss'
@connect(({ counter }) => ({
counter
}), (dispatch) => ({
add () {
dispatch(add())
},
dec () {
dispatch(minus())
},
asyncAdd () {
dispatch(asyncAdd())
}
}))
class Index extends Component {
config = {
navigationBarTitleText: '首页'
}
//http://ihome6.com/Shop-supplyShops
componentDidMount(){
Taro.navigateTo({
url: '/pages/home/home'
})
// Taro.request({
// url:'http://192.168.1.230/Shop-wxStore',
// })
// .then(res => console.log(res.data))
}
componentWillReceiveProps (nextProps) {
console.log(this.props, nextProps)
}
componentWillUnmount () { }
componentDidShow () { }
componentDidHide () { }
render () {
return (
<View className='index'>
</View>
)
}
}
export default Index

View File

22
src/reducers/counter.js Normal file
View File

@ -0,0 +1,22 @@
import { ADD, MINUS } from '../constants/counter'
const INITIAL_STATE = {
num: 0
}
export default function counter (state = INITIAL_STATE, action) {
switch (action.type) {
case ADD:
return {
...state,
num: state.num + 1
}
case MINUS:
return {
...state,
num: state.num - 1
}
default:
return state
}
}

6
src/reducers/index.js Normal file
View File

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

28
src/store/index.js Normal file
View File

@ -0,0 +1,28 @@
import { createStore, applyMiddleware, compose } from 'redux'
import thunkMiddleware from 'redux-thunk'
import rootReducer from '../reducers'
const composeEnhancers =
typeof window === 'object' &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
// Specify extensions options like name, actionsBlacklist, actionsCreators, serialize...
}) : compose
const middlewares = [
thunkMiddleware
]
if (process.env.NODE_ENV === 'development') {
middlewares.push(require('redux-logger').createLogger())
}
const enhancer = composeEnhancers(
applyMiddleware(...middlewares),
// other store enhancers if any
)
export default function configStore () {
const store = createStore(rootReducer, enhancer)
return store
}