Skip to content

Y
yangpu
Commit baf61f9f authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

修改

parent 39f3fe67
Show whitespace changes
Inline Side-by-side
Showing with 146 additions and 65 deletions
src/components/MonitorComponents/MonitorTitle/monitor-title.vue
View file @ baf61f9f
......@@ -7,6 +7,17 @@
</span> -->
<div class="btn back" @click="closePage" />
<div class="btn close" @click="closePage" />
<div class="slogan left">
<span v-for="(word, i) in slogan[0]" :key="i+word">{{word}}</span>
</div>
<div class="slogan right">
<span v-for="(word, i) in slogan[1]" :key="i+word">{{word}}</span>
</div>
<div class="duty">
今日值班：
<p>李明良<img src="@/assets/images/phone.png" /></p>
<p>方芳<img src="@/assets/images/phone.png" /></p>
</div>
<span v-if="!hideTime" class="moment time">
<!-- <span class="switch"><img src="@/assets/images/switch.png"/> 切换街道</span> -->
{{curDate}} {{time}}
......@@ -17,6 +28,7 @@
</template>
<script>
// import axios from 'axios'
export default {
name: 'MonitorTitle',
props: {
......@@ -49,6 +61,7 @@ export default {
timer: null,
time: null,
style: {},
slogan: ['人民城市人民建', '人民城市为人民'],
}
},
mounted() {
......@@ -57,13 +70,7 @@ export default {
this.time = `${this.$moment().format('dddd')} ${this.$moment().format('LTS')}`
}, 1000)
}
// if (this.color) {
// this.style = {
// 'text-shadow': `0 0.02rem 0.04rem ${this.color}`,
// 'color': this.color,
// 'background-image': `linear-gradient(to bottom, #fff, ${this.color})`
// }
// }
// this.getWeather()
this.style = {...this.style, 'font-size': this.size}
},
beforeDestroy() {
......@@ -94,6 +101,13 @@ export default {
closePage() {
window.close()
},
// getWeather() {
// axios.get('https://tianqiapi.com/api?version=v6&appid=27325769&appsecret=k2G7Q7bA&city=杨浦&vue=1'
// ).then(res => {
// this.weather = res.data
// console.log(this.weather)
// })
// },
}
}
</script>
......@@ -128,6 +142,27 @@ export default {
background-image url(../../../assets/images/close.png)
&:hover
background-image url(../../../assets/images/close-on.png)
.slogan
display flex
justify-content space-around
align-items center
width 15%
position absolute
top .05rem
z-index: 2;
&.left
left 20%
&.right
right 20%
span
$flex-center()
width .2rem
height @width
background rgba(2,68,147,.8)
border-radius 50%
font-family $font-pang
font-size .14rem
font-weight normal
.switch
color #5BD5FF
margin-right .1rem
......@@ -136,46 +171,35 @@ export default {
width .12rem
vertical-align middle
.moment
z-index 100
z-index 9
position absolute
font-size 0.12rem
color #fff
// width 1.5rem
top 25%
// &.date
// right 15%
&.time
// right 15%
left 0
right 0
margin 0 auto
text-align center
transform translateX(25%)
top .07rem
left 3%
.duty
display flex
align-items center
z-index 9
position absolute
top .07rem
right 3%
p
color $color-yellow
margin 0 .05rem
img
width .08rem
height @width
margin-left .05rem
>.bg
position absolute
width 100%
height 100%
top 0
left 0
// animation shine 2.5s linear reverse infinite
>p
// text-shadow 0 0.02rem 0.04rem #B3EBFF
background-clip text
-webkit-background-clip text
// color #B3EBFF
-webkit-text-fill-color transparent
background-image linear-gradient(to bottom, #fff, #B3EBFF)
z-index 99
letter-spacing .05rem
// @keyframes shine {
// 0% {
// opacity 1
// }
// 50% {
// opacity 0.7
// }
// 100% {
// opacity 1
// }
// }
</style>
src/store/state.js
View file @ baf61f9f
......@@ -64,18 +64,18 @@ const commandLayout2 = [
]
export default {
streets: [
{id: 310110001000, name: '定海路街道', houseId: 310110000169, center: [8140.864167601668, 5079.364284699033]},
{id: 310110006000, name: '平凉路街道', houseId: 310110000167, center: [5107.94932750342, 2423.6864417613733]},
{id: 310110008000, name: '江浦路街道', houseId: 310110000177, center: [4211.45116637842, 3786.741592954671]},
{id: 310110009000, name: '四平路街道', houseId: 310110000170, center: [3293.5942071892155, 5147.717485190097]},
{id: 310110012000, name: '控江路街道', houseId: 310110000171, center: [5008.673834530317, 5227.606100514474]},
{id: 310110013000, name: '长白新村街道', houseId: 310110000173, center: [7430.66083957447, 6663.5712796890675]},
{id: 310110015000, name: '延吉新村街道', houseId: 310110000172, center: [6246.9579368837085, 5745.491634168607]},
{id: 310110016000, name: '殷行街道', houseId: 310110000176, center: [6688.878806764382, 10366.540369915294]},
{id: 310110018000, name: '大桥街道', houseId: 310110000166, center: [6374.902499188995, 3511.8719065605596]},
{id: 310110019000, name: '五角场街道', houseId: 310110000174, center: [3296.4282528002864, 7281.637272274846]},
{id: 310110020000, name: '新江湾城街道', houseId: 310110000168, center: [3635.8506067447124, 10472.688944671301]},
{id: 310110101000, name: '长海路街道', houseId: 310110000175, center: [6016.66261261553, 8153.563542586172]},
{id: 310110020000, name: '新江湾城街道', houseId: 310110000168, center: [3635.8506067447124, 10472.688944671301], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=-i6_oyv1Vf-BgqEojN0pPQ8bHK5LfXy6'},
{id: 310110001000, name: '定海路街道', houseId: 310110000169, center: [8140.864167601668, 5079.364284699033], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=ftoVMdCb29K2O7W5Ki-rke8vOFA_GsKM'},
{id: 310110006000, name: '平凉路街道', houseId: 310110000167, center: [5107.94932750342, 2423.6864417613733], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=D_ssgjWDvxbcMcS_eVuPC5_5imPY_YW1'},
{id: 310110008000, name: '江浦路街道', houseId: 310110000177, center: [4211.45116637842, 3786.741592954671], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=LjBjfj4BrtnsBbPzsUuSo4IR27brzOkO'},
{id: 310110009000, name: '四平路街道', houseId: 310110000170, center: [3293.5942071892155, 5147.717485190097], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=YAZ9Q4o9hgi_cw9QB3Zx2fYklef5Dtmz'},
{id: 310110012000, name: '控江路街道', houseId: 310110000171, center: [5008.673834530317, 5227.606100514474], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=tsM-JsYK7pgCRb2FMmwtGWuoR0TwCkkD'},
{id: 310110013000, name: '长白新村街道', houseId: 310110000173, center: [7430.66083957447, 6663.5712796890675], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=J9lTtuTBWjinCpGaX-1kH0ssBamIoSmY'},
{id: 310110015000, name: '延吉新村街道', houseId: 310110000172, center: [6246.9579368837085, 5745.491634168607], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=8zDuAqseqAD5EYvYclnY5jpQw_-TzblE'},
{id: 310110016000, name: '殷行街道', houseId: 310110000176, center: [6688.878806764382, 10366.540369915294], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=B3_40kuhej63_QyN0LlDOeuOD1HqL5_F'},
{id: 310110018000, name: '大桥街道', houseId: 310110000166, center: [6374.902499188995, 3511.8719065605596], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=0Sn0K5LW4p7cc6rbCfY8mRqJ2uMS_Bvc'},
{id: 310110019000, name: '五角场街道', houseId: 310110000174, center: [3296.4282528002864, 7281.637272274846], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=aYOvtgp4LdE37YvY4twwbP-bAKl9gXKx'},
{id: 310110101000, name: '长海路街道', houseId: 310110000175, center: [6016.66261261553, 8153.563542586172], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=cRV65vfRR-i9IHhK7TwAKte57x7W9iHC'},
],
healthInfo: {
creditScore: {},
......@@ -84,7 +84,7 @@ export default {
ownerSatisfactionScore: {},
monthCheck: {},
},
currentStreetInfo: {id: 310110020000, name: '新江湾城街道', houseId: 310110000168, center: [3635.8506067447124, 10472.688944671301]},
currentStreetInfo: {id: 310110020000, name: '新江湾城街道', houseId: 310110000168, center: [3635.8506067447124, 10472.688944671301], url: 'http://10.81.71.38/chengyun/chengyun_town/page1.html#/?code=-i6_oyv1Vf-BgqEojN0pPQ8bHK5LfXy6'},
showLoading: false,
curDate: null,
curSmartType: null,
......
src/views/components/application.vue
View file @ baf61f9f
<template>
<div class="application">
<div v-for="item in list" :key="item.name">
<div v-for="item in list" :key="item.name" @click.prevent="handleClick(item.key)">
<img :src="require(`@/assets/images/${item.icon}`)" />
<p>{{item.name}}</p>
</div>
......@@ -16,10 +16,19 @@ export default {
{name: '会议系统', icon: 'app1.png'},
{name: '派单系统', icon: 'app2.png'},
{name: '气象系统', icon: 'app3.png'},
{name: '网格系统', icon: 'app4.png'},
{name: '网格系统', icon: 'app4.png', key: 'jumpGridPage'},
]
}
},
methods: {
handleClick(key) {
key && this[key]()
},
jumpGridPage() {
const {url} = this.$store.state.currentStreetInfo
window.open(url)
},
}
}
</script>
......@@ -30,6 +39,10 @@ export default {
justify-content space-around
>div
text-align center
cursor pointer
padding 0 .05rem
&:hover
box-shadow 0 .3rem 0.1rem 0.05rem rgba(0,0,0,0.2)
img
height .3rem
width auto
......
src/views/components/complaint-repair.vue
View file @ baf61f9f
......@@ -70,8 +70,8 @@ export default {
list() {
const {repairInfo} = this.$store.state
return [
{name: '报修数量', value: repairInfo[0], img: 'repair.png'},
{name: '投诉数量', value: repairInfo[1], img: 'complaint.png'},
{name: '报修数量', value: repairInfo[0], img: 'icon5.png'},
{name: '投诉数量', value: repairInfo[1], img: 'icon6.png'},
]
},
}
......@@ -93,9 +93,9 @@ export default {
display flex
align-items center
img
width .25rem
width .15rem
height @width
margin-right .05rem
margin-right .1rem
p
color $fontColor
&:last-child
......
src/views/components/grid-management.vue
View file @ baf61f9f
......@@ -34,8 +34,8 @@ export default {
sum() {
const {gridSum, notAlertSum} = this.$store.state
return [
{name: '网格事件数', value: gridSum, img: 'tips2.png'},
{name: '110非警情数', value: notAlertSum, img: 'tips3.png'},
{name: '网格事件数', value: gridSum, img: 'icon3.png'},
{name: '110非警情数', value: notAlertSum, img: 'icon4.png'},
]
}
},
......@@ -54,7 +54,7 @@ export default {
align-items center
font-size .11rem
img
width .2rem
width .15rem
height @width
margin 0 .1rem
.content
......
src/views/components/map-btns.vue
View file @ baf61f9f
......@@ -35,7 +35,7 @@ export default {
.map-btns
position fixed
left calc(33.3% + .05rem)
bottom .05rem
bottom .1rem
transition left .5s ease-in-out
&.isFull
left .05rem
......
src/views/components/property-score.vue
View file @ baf61f9f
......@@ -20,10 +20,10 @@
</div>
<div class="govern">
<div class="content">
<p><m-count class="count" :value="92" :decimal="0" /><span class="unit">（分）</span></p>
<p><m-count class="count" :style="`color:${switchColor}`" :value="total" :decimal="0" /><span class="unit">（分）</span></p>
<p>整体治理得分</p>
</div>
<div class="needel" />
<div class="needel" :style="`background:linear-gradient(to top, transparent 45%, ${switchColor});transform:rotate(${switchDeg}deg)`"/>
</div>
</div>
<div>
......@@ -145,13 +145,56 @@ export default {
// +monthCheck.county || 0,
// ]
},
total() {
const {id} = this.$store.state.currentStreetInfo
const {creditScore, propertyWarrantyScore, communityManagementScore, ownerSatisfactionScore, monthCheck} = this.$store.state.healthInfo
const list = [
+creditScore[id + ''] || 0,
+propertyWarrantyScore[id + ''] || 0,
+communityManagementScore[id + ''] || 0,
+ownerSatisfactionScore[id + ''] || 0,
+monthCheck[id + ''] || 0,
]
return list.reduce((cur, acc) => cur + acc, 0)
},
switchColor() {
if (this.total >= 75) {
return '#75e1b0'
}
if (this.total < 75 && this.total > 20) {
return '#ffd400'
}
if (this.total <= 20) {
return '#ff1e1e'
}
// if (this.total >= 90) {
// return '#75e1b0'
// }
// if (this.total < 90 && this.total >= 80) {
// return '#ffd400'
// }
// if (this.total < 80) {
// return '#ff1e1e'
// }
},
switchDeg() {
if (this.total >= 50) {
const rate = (this.total - 50) / 50
return (90 * rate).toFixed(1)
} else if (this.total > 0 && this.total < 50) {
const rate = (50 - this.total) / 50
return (-90 * rate).toFixed(1)
} else {
return -90
}
}
},
methods: {
init() {
this.chart = echarts.init(this.$refs.chart)
window.addEventListener('resize', () => this.chart.resize())
this.chart.setOption(this.option)
}
},
},
watch: {
chartData() {
......@@ -211,11 +254,11 @@ export default {
position absolute
width .05rem
height .65rem
background linear-gradient(to top, transparent 45%, #44D7B6)
left 0
right 0
bottom .2rem
margin auto
transition rotate .3s ease-in-out
transform rotate(-90deg)
transform-origin bottom
transform rotate(60deg)
</style>
src/views/components/right-component.vue
View file @ baf61f9f
......@@ -71,7 +71,8 @@ export default {
position relative
flex-wrap wrap
>div
width 50%
// width 50%
width calc(33.3vw / 2)
height 80%
&.left
>div
......
src/views/components/smart-discover.vue
View file @ baf61f9f
......@@ -138,7 +138,7 @@ export default {
display flex
flex 1
align-items center
padding-left .05rem
padding-left .1rem
img
width .15rem
height @width
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment