diff --git a/src/assets/images/weather/PM.png b/src/assets/images/weather/PM.png deleted file mode 100644 index 3fb62ba..0000000 Binary files a/src/assets/images/weather/PM.png and /dev/null differ diff --git a/src/assets/images/weather/gz.png b/src/assets/images/weather/gz.png new file mode 100644 index 0000000..68d8f79 Binary files /dev/null and b/src/assets/images/weather/gz.png differ diff --git a/src/assets/images/weather/index0.png b/src/assets/images/weather/index0.png deleted file mode 100644 index a3d7df9..0000000 Binary files a/src/assets/images/weather/index0.png and /dev/null differ diff --git a/src/assets/images/weather/kqsd.png b/src/assets/images/weather/kqsd.png new file mode 100644 index 0000000..d87ea6c Binary files /dev/null and b/src/assets/images/weather/kqsd.png differ diff --git a/src/assets/images/weather/kqwd.png b/src/assets/images/weather/kqwd.png new file mode 100644 index 0000000..f51cd1d Binary files /dev/null and b/src/assets/images/weather/kqwd.png differ diff --git a/src/assets/images/weather/line.png b/src/assets/images/weather/line.png new file mode 100644 index 0000000..568daff Binary files /dev/null and b/src/assets/images/weather/line.png differ diff --git a/src/assets/images/weather/temperature.png b/src/assets/images/weather/temperature.png deleted file mode 100644 index fc68ab1..0000000 Binary files a/src/assets/images/weather/temperature.png and /dev/null differ diff --git a/src/assets/images/weather/trsd.png b/src/assets/images/weather/trsd.png new file mode 100644 index 0000000..99206ea Binary files /dev/null and b/src/assets/images/weather/trsd.png differ diff --git a/src/assets/images/weather/trwd.png b/src/assets/images/weather/trwd.png new file mode 100644 index 0000000..633056a Binary files /dev/null and b/src/assets/images/weather/trwd.png differ diff --git a/src/assets/images/weather/windPower.png b/src/assets/images/weather/windPower.png deleted file mode 100644 index 4c3163f..0000000 Binary files a/src/assets/images/weather/windPower.png and /dev/null differ diff --git a/src/assets/images/weather/yu.png b/src/assets/images/weather/yu.png new file mode 100644 index 0000000..a219a8e Binary files /dev/null and b/src/assets/images/weather/yu.png differ diff --git a/src/views/next/layout/screen-header.vue b/src/views/next/layout/screen-header.vue index 0fa69db..3c29443 100644 --- a/src/views/next/layout/screen-header.vue +++ b/src/views/next/layout/screen-header.vue @@ -1,10 +1,20 @@ @@ -34,9 +44,9 @@ export default { }, methods: { ...mapActions({ - set_nav: 'SET_NAV', + set_nav: 'SET_NAV', - }), + }), computeCurrentTime() { let year = new Intl.DateTimeFormat('zh-CN-u-ca-chinese', { dateStyle: 'full' }).format(new Date()); this.showYearZh = '农历' + year.match(/年(.+)星期/)[1]; @@ -44,11 +54,11 @@ export default { this.showWeek = this.$moment().format("dddd"); this.showTime = this.$moment().format("LT"); }, - handelClearMap(){ - if(this.navId == 'whyf'){ + handelClearMap() { + if (this.navId == 'whyf') { this.set_nav('sy') - }else{ - this.$EventBus.$emit('switcMapType','Emap') + } else { + this.$EventBus.$emit('switcMapType', 'Emap') } }, @@ -74,14 +84,26 @@ export default { box-sizing: border-box; color: #ACBBD4; cursor: pointer; + .left, .right { - padding: 8px 0 0 0; box-sizing: border-box; position: relative; + + } + .left{ top: -4px; + >*{ + margin-right: 16px; + } + } + .right{ + top: 2px; + >*{ + + margin-left: 16px; + } } - .center { height: 100%; display: flex; @@ -107,4 +129,5 @@ export default { letter-spacing: 2px; } } -} +} + diff --git a/src/views/next/screen-content-right/home-right/index.vue b/src/views/next/screen-content-right/home-right/index.vue index 933e7ac..b318d01 100644 --- a/src/views/next/screen-content-right/home-right/index.vue +++ b/src/views/next/screen-content-right/home-right/index.vue @@ -6,14 +6,14 @@
- -
12°
-
- 多云 - 4/12°C +
+ +
12° 空气温度
-
- 良 + +
+ +
12° 空气湿度
@@ -42,7 +42,7 @@
- {{item.title}} + {{ item.title }}
@@ -55,19 +55,24 @@ export default { return { weatherList: [ { - units: '温度', - img: require('@/assets/images/weather/temperature.png'), - value: '20~30°' + units: '雨量', + img: require('@/assets/images/weather/yu.png'), + value: '20~30mm' }, { - units: '风力', - img: require('@/assets/images/weather/windPower.png'), - value: '3~4级' + units: '光照', + img: require('@/assets/images/weather/gz.png'), + value: '18.8lux' }, { - units: 'PM2.5', - img: require('@/assets/images/weather/PM.png'), - value: '21~46μg' + units: '土壤温度', + img: require('@/assets/images/weather/trwd.png'), + value: '15~21°C' + }, + { + units: '土壤湿度', + img: require('@/assets/images/weather/trsd.png'), + value: '52°C' } ], videoStatus: '', @@ -78,7 +83,7 @@ export default { { imgSrc: require('@/assets/images/resource/whyf/3.jpg'), title: '金吉友拳法' }, { imgSrc: require('@/assets/images/resource/whyf/4.jpg'), title: '张院簸箕制作技艺' }, { imgSrc: require('@/assets/images/resource/whyf/5.jpg'), title: '毛子埠升制作技艺' }, - { imgSrc: require('@/assets/images/resource/whyf/6.jpg'), title: '上铂金银器打造工艺' } + { imgSrc: require('@/assets/images/resource/whyf/6.jpg'), title: '上铂金银器打造工艺' } ] }; @@ -116,75 +121,64 @@ export default { >.top { display: flex; - align-items: center; margin-right: 9px; + justify-content: space-between; + padding: 0 20px; + position: relative; + >.item { + @include flex(); + align-items: center; - img { - width: 70px; - height: 70px; - } - - >:nth-child(2) { - text-shadow: 0 0 10px; - font-size: 48px; - margin-right: 25px; - - } - - >:nth-child(3) { - height: 100%; - @include flex(column); - justify-content: space-evenly; - color: #BDCEEA; - - - } - - >:nth-child(4) { - padding: 4px 16px 4px 23px; - height: 22px; - box-sizing: border-box; - background: #31609f; - border-radius: 11px; - font-size: 14px; - color: #ACBBD4; - line-height: 14px; - position: relative; - top: -15px; - - &::after { - content: ''; - position: absolute; - left: 10px; - top: 7px; - width: 8px; - height: 8px; - border-radius: 50%; - background: #E3FFFF; + img { + width: 34px; + height: 34px; + margin-right: 12px; } - } + >div { + width: 100%; + height: 100%; + @include flex(column); + justify-content: space-evenly; + :nth-child(1) { + text-shadow: 0 0 10px; + font-size: 22px; + font-weight: bold; + font-family: pangmenzhengdao; + letter-spacing: 4px; + } + + :nth-child(2) { + color: #BDCEEA; + // margin-top: 12px; + } + } + } } >.bto { - margin-top: 16px; + margin-top: 20px; display: flex; justify-content: space-around; >.item { - width: 120px; - height: 100px; + width: 90px; + height: 106px; background: url('~@/assets/images/common/weather-card.png') no-repeat; background-size: 100% 100%; @include flex(column); align-items: center; + justify-content: space-between; + font-size: 14px; + padding-bottom: 5px; + box-sizing: border-box; img { width: 30px; height: 30px; - margin: 12px 0; + margin-top: 15px; } :nth-child(3) { @@ -205,6 +199,7 @@ export default { box-sizing: border-box; display: flex; flex-wrap: wrap; + .item { width: 140px; height: 108px; @@ -216,6 +211,7 @@ export default { color: #BDCEEA; font-size: 12px; align-items: center; + img { width: 130px; height: 80px; @@ -224,5 +220,4 @@ export default { } -} - +}