Alawn/antd-admin
1
0
Fork 0
mirror of https://github.com/zuiidea/antd-admin synced 2026-10-26 18:28:57 +00:00
Code Issues Releases Wiki Activity

weather

Browse Source
This commit is contained in:
zuiidea
2016-12-14 23:11:56 +08:00
parent 67dd886130
commit e9c361a8a9
5 changed files with 245 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/dashboard/weather.js
+14 -19
View File
@@ -1,26 +1,21 @@
import React, {PropTypes} from 'react'
import {Icon} from 'antd'
import styles from './weather.less'
import {classnames, request} from '../../utils'
const Ajax = require("robe-ajax")
const Weather = React.createClass({
componentDidMount() {
this.fetch()
},
fetch() {
// Ajax.getJSON("http://query.yahooapis.com/v1/public/yql", {
// q: "select * from json where url=\"http://www.zuimeitianqi.com/zuimei/myCity?flg=0\"",
// format: "json"
// }, function (data) {
// console.log(data)
// })
},
render() {
return <div className={styles.weather}>
天气
function Weather(props) {
const {city, icon, dateTime, temperature, name} = props
return <div className={styles.weather}>
<div className={styles.left}>
<div style={styles.icon} style={{
backgroundImage: `url(${icon})`
}}></div>
<p style={styles.name}>{name}</p>
</div>
}
})
<div className={styles.right}>
<h1 className={styles.temperature}>{temperature + '°'}</h1>
<p className={styles.description}>{city},{dateTime}</p>
</div>
</div>
}
export default Weather
src/components/dashboard/weather.less
+20
View File
@@ -0,0 +1,20 @@
@import "../vars.less";
.weather{
color: #fff;
.left{
.icon{
}
.name{
}
}
.right{
.temperature{
}
.description{
}
}
}
src/models/dashboard.js
+183 -21
View File
@@ -1,12 +1,178 @@
import {myCity,queryWeather} from '../services/dashboard'
import {myCity, queryWeather} from '../services/dashboard'
import {parse} from 'qs'
// zuimei 摘自 http://www.zuimeitianqi.com/res/js/index.js
let zuimei = {
ParseActualData: function (actual, air) {
let weather = {
icon: 'http://www.zuimeitianqi.com/res/icon/' + zuimei.GetIconName(actual.wea, "big"),
name: zuimei.GetWeatherName(actual.wea),
temperature: actual.tmp,
dateTime: new Date(actual.PTm).format('hh:mm')
}
return weather
},
GetIconName: function (wea, flg) {
let myDate = new Date()
let hour = myDate.getHours()
let num = 0
if (wea.indexOf("/") != -1) {
let weas = wea.split("/")
if (hour < 12) {
num = zuimei.ReplaceIcon(weas[0])
if (num < 6) {
num = num + "_" + flg + "_night.png"
} else {
num = num + "_" + flg + ".png"
}
} else if (12 <= hour) {
num = zuimei.ReplaceIcon(weas[1])
if (hour >= 18) {
num = num + "_" + flg + "_night.png"
} else {
num = num + "_" + flg + ".png"
}
}
} else {
if ((hour >= 18 && hour <= 23) || (hour >= 0 && hour <= 6)) {
num = num + "_" + flg + "_night.png"
} else {
num = num + "_" + flg + ".png"
}
}
return num
},
ReplaceIcon: function (num) {
if (num == 21) {
num = 7
} else if (num == 22) {
num = 8
} else if (num == 10 || num == 11 || num == 12 || num == 23 || num == 24 || num == 25) {
num = 9
} else if (num == 13 || num == 15 || num == 26 || num == 27 || num == 34) {
num = 14
} else if (num == 17 || num == 28) {
num = 16
} else if (num == 35) {
num = 18
} else if (num == 31 || num == 32 || num == 33) {
num = 20
} else if (num == 30) {
num = 29
}
return num
},
GetWeatherName: function (wea) {
let name = ""
if (wea.indexOf("/") != -1) {
let weas = wea.split("/")
name = zuimei.GetWeatherByCode(weas[0]) + "转" + zuimei.GetWeatherByCode(weas[1])
} else {
name = zuimei.GetWeatherByCode(wea)
}
return name
},
GetWeatherByCode: function (num) {
let wea = ""
if (num == 0) {
wea = "晴"
} else if (num == 1) {
wea = "多云"
} else if (num == 2) {
wea = "阴"
} else if (num == 3) {
wea = "阵雨"
} else if (num == 4) {
wea = "雷阵雨"
} else if (num == 5) {
wea = "雷阵雨并伴有冰雹"
} else if (num == 6) {
wea = "雨夹雪"
} else if (num == 7) {
wea = "小雨"
} else if (num == 8) {
wea = "中雨"
} else if (num == 9) {
wea = "大雨"
} else if (num == 10) {
wea = "暴雨"
} else if (num == 11) {
wea = "大暴雨"
} else if (num == 12) {
wea = "特大暴雨"
} else if (num == 13) {
wea = "阵雪"
} else if (num == 14) {
wea = "小雪"
} else if (num == 15) {
wea = "中雪"
} else if (num == 16) {
wea = "大雪"
} else if (num == 17) {
wea = "暴雪"
} else if (num == 18) {
wea = "雾"
} else if (num == 19) {
wea = "冻雨"
} else if (num == 20) {
wea = "沙尘暴"
} else if (num == 21) {
wea = "小雨-中雨"
} else if (num == 22) {
wea = "中雨-大雨"
} else if (num == 23) {
wea = "大雨-暴雨"
} else if (num == 24) {
wea = "暴雨-大暴雨"
} else if (num == 25) {
wea = "大暴雨-特大暴雨"
} else if (num == 26) {
wea = "小雪-中雪"
} else if (num == 27) {
wea = "中雪-大雪"
} else if (num == 28) {
wea = "大雪-暴雪"
} else if (num == 29) {
wea = "浮沉"
} else if (num == 30) {
wea = "扬沙"
} else if (num == 31) {
wea = "强沙尘暴"
} else if (num == 32) {
wea = "飑"
} else if (num == 33) {
wea = "龙卷风"
} else if (num == 34) {
wea = "若高吹雪"
} else if (num == 35) {
wea = "轻雾"
} else if (num == 53) {
wea = "霾"
} else if (num == 99) {
wea = "未知"
}
return wea
}
}
export default {
namespace : 'dashboard',
state : {
weather: {
},
city: '成都',
temperature: '5',
name: '晴',
icon: 'http://www.zuimeitianqi.com/res/icon/res/icon/0_big.png',
dateTime: new Date().format('hh:mm')
}
},
subscriptions : {
setup({dispatch}) {
@@ -17,28 +183,24 @@ export default {
*queryWeather({
payload
}, {call, put}) {
const myCityResult = yield call(myCity, {flg:0})
const myCityResult = yield call(myCity, {flg: 0})
const myCityData = myCityResult.query.results.json
const result = yield call(queryWeather, {cityCode:myCityData.selectCityCode})
const result = yield call(queryWeather, {cityCode: myCityData.selectCityCode})
const data = result.query.results.json
const weather = zuimei.ParseActualData(data.data.actual)
weather.city = myCityData.selectCityName
console.log(data)
// if (data.success) {
// yield put({
// type: 'loginSuccess',
// payload: {
// user: {
// name: data.username
// }
// }
// })
// } else {
// yield put({type: 'hideLoading'})
// }
},
yield put({type: 'queryWeatherSuccess', payload: {
weather
}})
}
},
reducers : {
queryWeatherSuccess(state, action) {
return {
...state,
...action.payload
}
}
}
}
src/routes/dashboard.js
+4 -9
View File
@@ -43,15 +43,10 @@ const quoteProps={
avatar:'http://img.hb.aicdn.com/bc442cf0cc6f7940dcc567e465048d1a8d634493198c4-sPx5BR_fw236',
}
// http://api.map.baidu.com/telematics/v3/weather?location=%E5%8C%97%E4%BA%AC&output=json&ak=E4805d16520de693a3fe707cdc962045
const weatherProps={
weatherText:'雨',
weatherIcon:'雨',
location:'成都',
}
function Dashboard() {
function Dashboard({dashboard}) {
const {weather} = dashboard
const numberCards = numberCardData.map((item,key) => <Col key={key} lg={6} md={12}>
<NumberCard {...item}/>
</Col>)
@@ -72,7 +67,7 @@ function Dashboard() {
</Col>
<Col lg={24} md={12}>
<Card bordered={false} bodyStyle={{padding:0,height:204,background:color.blue}}>
<Weather {...weatherProps}/>
<Weather {...weather}/>
</Card>
</Col>
</Row>
@@ -99,7 +94,7 @@ function Dashboard() {
)}
Dashboard.propTypes = {
location: PropTypes.object
dashboard: PropTypes.object
}
function mapStateToProps({ dashboard }) {
src/utils/index.js
+24 -2
View File
@@ -15,7 +15,29 @@ String.prototype.hyphenToHump = function () {
// 驼峰转连字符
String.prototype.humpToHyphen = function () {
return this.replace(/([A-Z])/g,"-$1").toLowerCase()
return this.replace(/([A-Z])/g, "-$1").toLowerCase()
}
// 日期格式化
Date.prototype.format = function (format) {
var o = {
"M+": this.getMonth() + 1,
"d+": this.getDate(),
"h+": this.getHours(),
'H+': this.getHours(),
"m+": this.getMinutes(),
"s+": this.getSeconds(),
"q+": Math.floor((this.getMonth() + 3) / 3),
"S": this.getMilliseconds()
}
if (/(y+)/.test(format))
format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length))
for (var k in o)
if (new RegExp("(" + k + ")").test(format))
format = format.replace(RegExp.$1, RegExp.$1.length == 1
? o[k]
: ("00" + o[k]).substr(("" + o[k]).length))
return format
}
module.exports = {
@@ -23,5 +45,5 @@ module.exports = {
menu,
request,
color,
classnames,
classnames
}