Commit 58a757aa authored by 郭铭瑶's avatar 郭铭瑶 🤘

对接接口

parent 546731f5
...@@ -44,6 +44,7 @@ export default { ...@@ -44,6 +44,7 @@ export default {
GET_PUBLICSAFE_STREETPOWER: '/service-special-nandong/streetPower', // 网格工作站(原名街道力量) GET_PUBLICSAFE_STREETPOWER: '/service-special-nandong/streetPower', // 网格工作站(原名街道力量)
GET_PUBLICSAFE_PARTY: '/service-special-nandong/party', // 党建 GET_PUBLICSAFE_PARTY: '/service-special-nandong/party', // 党建
GET_PUBLICSAFE_ECONOMIC: '/service-special-nandong/economic', // 经济 GET_PUBLICSAFE_ECONOMIC: '/service-special-nandong/economic', // 经济
/** 小区屏 */ /** 小区屏 */
GET_COMMUNITY_IDS: '/service-special-nandong/getSectIdList', // 获取小区id列表 GET_COMMUNITY_IDS: '/service-special-nandong/getSectIdList', // 获取小区id列表
GET_COMMUNITY_INFO: '/service-special-nandong/bigscreenCommunity/statistical', // 小区档案 GET_COMMUNITY_INFO: '/service-special-nandong/bigscreenCommunity/statistical', // 小区档案
...@@ -51,6 +52,7 @@ export default { ...@@ -51,6 +52,7 @@ export default {
GET_ISSUE_LIST: '/service-special-nandong/management/factors', // 管理要素列表 GET_ISSUE_LIST: '/service-special-nandong/management/factors', // 管理要素列表
GET_SCORE_ISSUE: '/service-special-nandong/score/elements', // 评分要素 GET_SCORE_ISSUE: '/service-special-nandong/score/elements', // 评分要素
GET_COMBINE_LIST: '/service-special-nandong/league/linkage', // 联勤联动列表 GET_COMBINE_LIST: '/service-special-nandong/league/linkage', // 联勤联动列表
/** 报警发短信 */ /** 报警发短信 */
POST_ALARM: '/service-alarm-nandong/public/alarm', POST_ALARM: '/service-alarm-nandong/public/alarm',
...@@ -62,6 +64,8 @@ export default { ...@@ -62,6 +64,8 @@ export default {
GET_DUTY_EVENTS: '/service-special-nandong/compair/getRanking/cmt', // 勤务分析 - 居委事件数量 GET_DUTY_EVENTS: '/service-special-nandong/compair/getRanking/cmt', // 勤务分析 - 居委事件数量
GET_DUTY_PLACES: '/service-special-nandong/compair/getRanking/addr', // 勤务分析 - 多发地点 GET_DUTY_PLACES: '/service-special-nandong/compair/getRanking/addr', // 勤务分析 - 多发地点
GET_DUTY_RANKING: '/service-special-nandong/compair/getRanking/all', // 勤务分析 - 排行 GET_DUTY_RANKING: '/service-special-nandong/compair/getRanking/all', // 勤务分析 - 排行
GET_OLD_SERVICE: '/service-special-nandong/forOld/statistics', // 便民 - 为老
GET_LIFE_CONVENIENT: '/service-special-nandong/convenient/statistics', // 便民 - 生活便利
/** 公共管理 */ /** 公共管理 */
GET_YOUSUBIDA_RANK: '/service-special-nandong/compair/willReach', // 有诉必答-占比 GET_YOUSUBIDA_RANK: '/service-special-nandong/compair/willReach', // 有诉必答-占比
...@@ -74,4 +78,11 @@ export default { ...@@ -74,4 +78,11 @@ export default {
GET_TRACKEVENT: '/service-special-nandong/compairs', // 有求必应-事件跟踪 GET_TRACKEVENT: '/service-special-nandong/compairs', // 有求必应-事件跟踪
GET_CASE_CLASSIFICATION_RANK: '/service-special-nandong/compair/analysis', // 案件分析-分类排行 GET_CASE_CLASSIFICATION_RANK: '/service-special-nandong/compair/analysis', // 案件分析-分类排行
GET_MOREHAPPEN_ADDR: '/service-special-nandong/compair/analysis/addr', // 案件分析-多发地点 GET_MOREHAPPEN_ADDR: '/service-special-nandong/compair/analysis/addr', // 案件分析-多发地点
/** 公共服务 */
GET_ECOLOGY_LIST: '/service-basicdatasync-ddd/nonResident/ecological', // 生态-衣食住行
GET_ECOLOGY_CONVENIENT: '/service-special-nandong/convenient/ecological', // 生态-便民设施
GET_ECOLOGY_PHOTO: '/service-special-nandong/buildingPhotos', // 生态 - 商业综合体、文保、历保照片
GET_ELEV_COUNT: '/service-special-nandong/elevatorAdd/statistical', // 美丽家园-电梯加装统计数字
GET_ELEV_LIST: '/service-special-nandong/elevatorAdds', // 美丽家园 - 根据名称查询列表
} }
...@@ -47,7 +47,7 @@ $font-color = #70A7E0 ...@@ -47,7 +47,7 @@ $font-color = #70A7E0
$table-bg(opacity = 0.3) $table-bg(opacity = 0.3)
rgba(0, 118, 255, opacity ) rgba(0, 118, 255, opacity )
$card-bg2() $card-bg2(opacity = 0.4, shadow = 0.2)
background rgba(70,83,97,.4) background rgba(70,83,97,opacity)
box-shadow inset 0 .01rem .02rem 0 rgba(204,204,204,.2) box-shadow inset 0 .01rem .02rem 0 rgba(204,204,204,shadow)
border-radius .03rem border-radius .03rem
\ No newline at end of file
This diff is collapsed.
...@@ -60,6 +60,28 @@ export interface DutyDataProp { ...@@ -60,6 +60,28 @@ export interface DutyDataProp {
[key: string]: { [key: string]: any }[] [key: string]: { [key: string]: any }[]
} }
export interface EcologyListProp {
labelName: string
num: number
}
export interface EcologyPhotoProp {
buildingName: string
buildingType: string
id: string
photoUrl?: string
}
export interface ForOldProp {
facilitiesType: string
num: number
}
export interface ElevCountProp {
cmtName: string
num: number
}
export interface GlobalStateProps { export interface GlobalStateProps {
showLoading: boolean showLoading: boolean
curView: ViewType curView: ViewType
...@@ -119,6 +141,12 @@ export interface GlobalStateProps { ...@@ -119,6 +141,12 @@ export interface GlobalStateProps {
trackEvent: any[] trackEvent: any[]
analysisRank: Partial<DutyDataProp> analysisRank: Partial<DutyDataProp>
moreHappenAddr: Partial<DutyDataProp> moreHappenAddr: Partial<DutyDataProp>
ecologyList: EcologyListProp[]
ecologyConvenient: EcologyListProp[]
ecologyPhoto: EcologyPhotoProp[]
oldService: ForOldProp[]
lifeConvenient: EcologyListProp[]
elevCount: ElevCountProp[]
} }
export default createStore<GlobalStateProps>({ export default createStore<GlobalStateProps>({
......
...@@ -8,6 +8,10 @@ import { ...@@ -8,6 +8,10 @@ import {
DutySumProp, DutySumProp,
DutyDataProp, DutyDataProp,
YousubidaRankProp, YousubidaRankProp,
EcologyListProp,
EcologyPhotoProp,
ForOldProp,
ElevCountProp,
} from './index' } from './index'
export default { export default {
...@@ -191,6 +195,13 @@ export default { ...@@ -191,6 +195,13 @@ export default {
SET_DUTY_RANKING(state: GlobalStateProps, data: DutyDataProp): void { SET_DUTY_RANKING(state: GlobalStateProps, data: DutyDataProp): void {
state.dutyRanking = data state.dutyRanking = data
}, },
SET_OLD_SERVICE(state: GlobalStateProps, data: ForOldProp[]): void {
state.oldService = data
},
SET_LIFE_CONVENIENT(state: GlobalStateProps, data: EcologyListProp[]): void {
state.lifeConvenient = data
},
/** 公共管理 */ /** 公共管理 */
// 有诉必答-占比 // 有诉必答-占比
SET_YOUSUBIDA_RANK(state: GlobalStateProps, data: YousubidaRankProp): void { SET_YOUSUBIDA_RANK(state: GlobalStateProps, data: YousubidaRankProp): void {
...@@ -246,4 +257,23 @@ export default { ...@@ -246,4 +257,23 @@ export default {
SET_MOREHAPPEN_ADDR(state: GlobalStateProps, data: DutyDataProp): void { SET_MOREHAPPEN_ADDR(state: GlobalStateProps, data: DutyDataProp): void {
state.moreHappenAddr = data state.moreHappenAddr = data
}, },
/** 公共服务 - 生态 */
SET_ECOLOGY_LIST(state: GlobalStateProps, data: EcologyListProp[]): void {
state.ecologyList = data
},
SET_ECOLOGY_CONVENIENT(
state: GlobalStateProps,
data: EcologyListProp[]
): void {
state.ecologyConvenient = data
},
SET_ECOLOGY_PHOTO(state: GlobalStateProps, data: EcologyPhotoProp[]): void {
state.ecologyPhoto = data
},
/** 美丽家园-电梯 */
SET_ELEV_COUNT(state: GlobalStateProps, data: ElevCountProp[]): void {
state.elevCount = data
},
} }
...@@ -219,4 +219,10 @@ export default { ...@@ -219,4 +219,10 @@ export default {
trackEvent: [], trackEvent: [],
analysisRank: { day: [], week: [], month: [] }, analysisRank: { day: [], week: [], month: [] },
moreHappenAddr: { day: [], week: [], month: [] }, moreHappenAddr: { day: [], week: [], month: [] },
ecologyList: [],
ecologyConvenient: [],
ecologyPhoto: [],
oldService: [],
lifeConvenient: [],
elevCount: [],
} as GlobalStateProps } as GlobalStateProps
...@@ -134,12 +134,6 @@ export default defineComponent({ ...@@ -134,12 +134,6 @@ export default defineComponent({
}, },
] ]
}) })
store.dispatch('GET_PUBLICSAFE_COMMANDSYSTEM')
store.dispatch('GET_PUBLICSAFE_STREETPOWER')
store.dispatch('GET_PUBLICSAFE_PARTY')
store.dispatch('GET_PUBLICSAFE_ECONOMIC')
const commandSystem = computed(() => store.state.pubulicLeftCommandSystem) const commandSystem = computed(() => store.state.pubulicLeftCommandSystem)
const streetPower = computed(() => store.state.pubulicLeftStreetPower) const streetPower = computed(() => store.state.pubulicLeftStreetPower)
const party = computed(() => store.state.pubulicLeftParty) const party = computed(() => store.state.pubulicLeftParty)
......
<template> <template>
<m-card title="美丽家园" mode="4"> <m-card title="美丽家园" mode="4">
<div class="container">
<m-sub2>项目实施情况</m-sub2> <m-sub2>项目实施情况</m-sub2>
<div class="summary"> <div class="summary">
<div v-for="item in summary" :key="item.name"> <div v-for="item in summary" :key="item.name">
...@@ -27,6 +28,7 @@ ...@@ -27,6 +28,7 @@
:color="['rgba(253,211,116,.15)', '#F7933E']" :color="['rgba(253,211,116,.15)', '#F7933E']"
:msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }" :msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }"
/> />
</div>
</m-card> </m-card>
</template> </template>
...@@ -124,6 +126,11 @@ export default defineComponent({ ...@@ -124,6 +126,11 @@ export default defineComponent({
<style lang="stylus" scoped> <style lang="stylus" scoped>
@import '../../components/MyComponent/main.styl' @import '../../components/MyComponent/main.styl'
.container
height 100%
display flex
flex-direction column
justify-content space-around
.summary .summary
width 100% width 100%
display flex display flex
......
<template> <template>
<m-card title="美丽家园"> <m-card title="美丽家园">
<div class="container">
<m-sub2>项目实施情况</m-sub2> <m-sub2>项目实施情况</m-sub2>
<div class="summary"> <div class="summary">
<div v-for="item in summary" :key="item.name"> <div v-for="item in summary" :key="item.name">
...@@ -8,17 +9,16 @@ ...@@ -8,17 +9,16 @@
</div> </div>
</div> </div>
<Brief :list="situation" color="#fff" /> <Brief :list="situation" color="#fff" />
<!-- <div v-if="curViewType !== 'street'" class="sum-card work-station">
<div v-for="item in workStationProjects" :key="item.name">
<m-count class="count orange-count" :value="item.value" />
<p>{{ item.name }}</p>
</div>
</div> -->
<m-sub2 :addition="{ value: 33, unit: '幢' }">电梯加装(排摸)</m-sub2> <m-sub2 :addition="{ value: 33, unit: '幢' }">电梯加装(排摸)</m-sub2>
<div v-if="curViewType === 'street'" class="sum-card"> <div class="sum-card">
<div v-for="item in elevList" :key="item.name"> <div
<p>{{ item.name }}</p> v-for="item in elevList"
<m-count class="count" :value="item.value" /> :key="item.cmtName"
:class="{ on: curCmtName === item.cmtName }"
@click="handleSelect(item.cmtName)"
>
<p>{{ item.cmtName }}</p>
<m-count class="count" :value="item.num" />
</div> </div>
</div> </div>
<m-sub2>马桶改造</m-sub2> <m-sub2>马桶改造</m-sub2>
...@@ -28,6 +28,7 @@ ...@@ -28,6 +28,7 @@
:color="['rgba(253,211,116,.15)', '#F7933E']" :color="['rgba(253,211,116,.15)', '#F7933E']"
:msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }" :msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }"
/> />
</div>
</m-card> </m-card>
</template> </template>
...@@ -41,12 +42,12 @@ import icon33 from '@/assets/images/icon33.png' ...@@ -41,12 +42,12 @@ import icon33 from '@/assets/images/icon33.png'
import icon34 from '@/assets/images/icon34.png' import icon34 from '@/assets/images/icon34.png'
import icon35 from '@/assets/images/icon35.png' import icon35 from '@/assets/images/icon35.png'
import icon36 from '@/assets/images/icon36.png' import icon36 from '@/assets/images/icon36.png'
import { ajax, api } from '@/ajax'
export default defineComponent({ export default defineComponent({
name: 'BeautyHome', name: 'BeautyHome',
components: { Brief }, components: { Brief },
setup() { setup() {
const curViewType = computed(() => store.state.curView.type)
const summary = ref([ const summary = ref([
{ name: '2020年', value: 26 }, { name: '2020年', value: 26 },
{ name: '2019年', value: 24 }, { name: '2019年', value: 24 },
...@@ -58,15 +59,20 @@ export default defineComponent({ ...@@ -58,15 +59,20 @@ export default defineComponent({
{ name: '充电桩', value: 64, icon: icon33 }, { name: '充电桩', value: 64, icon: icon33 },
{ name: '雨污混接', value: 18, icon: icon34 }, { name: '雨污混接', value: 18, icon: icon34 },
]) ])
const elevList = ref([ const elevList = computed(() => store.state.elevCount)
{ name: '振兴', value: 9 }, const curCmtName = ref<string | null>(null)
{ name: '福海', value: 5 }, const handleSelect = async (name: string) => {
{ name: '江阴', value: 7 }, curCmtName.value === name
{ name: '定兴', value: 1 }, ? (curCmtName.value = null)
{ name: '新昌', value: 5 }, : (curCmtName.value = name)
{ name: '小花园', value: 5 }, if (!curCmtName.value) return
{ name: '顺天村', value: 1 },
]) const { content } = (
await ajax.get({ url: api.GET_ELEV_LIST, params: { cmtName: name } })
).data
// TODO 可能要出列表或者地图撒点之类的
console.log(`美丽街区-加装电梯-${name}区域电梯列表`, content)
}
const toiletSituation = ref<BriefProp[]>([ const toiletSituation = ref<BriefProp[]>([
{ name: '已完成改造', value: 26, icon: icon35 }, { name: '已完成改造', value: 26, icon: icon35 },
{ name: '应改造', value: 64, icon: icon36 }, { name: '应改造', value: 64, icon: icon36 },
...@@ -79,10 +85,11 @@ export default defineComponent({ ...@@ -79,10 +85,11 @@ export default defineComponent({
{ name: '公共设置', value: 8 }, { name: '公共设置', value: 8 },
]) ])
return { return {
curViewType,
summary, summary,
situation, situation,
elevList, elevList,
curCmtName,
handleSelect,
toiletSituation, toiletSituation,
workStationProjects, workStationProjects,
} }
...@@ -92,6 +99,11 @@ export default defineComponent({ ...@@ -92,6 +99,11 @@ export default defineComponent({
<style lang="stylus" scoped> <style lang="stylus" scoped>
@import '../../components/MyComponent/main.styl' @import '../../components/MyComponent/main.styl'
.container
height 100%
display flex
flex-direction column
justify-content space-around
.summary .summary
width 100% width 100%
display flex display flex
...@@ -112,10 +124,6 @@ export default defineComponent({ ...@@ -112,10 +124,6 @@ export default defineComponent({
display flex display flex
flex-wrap wrap flex-wrap wrap
justify-content space-between justify-content space-between
&.work-station
margin .05rem 0
>div
width 20%
>div >div
display flex display flex
justify-content space-between justify-content space-between
...@@ -124,6 +132,11 @@ export default defineComponent({ ...@@ -124,6 +132,11 @@ export default defineComponent({
$card-bg2() $card-bg2()
padding 0 .1rem padding 0 .1rem
margin-bottom .05rem margin-bottom .05rem
cursor pointer
transition all .3s ease
&:hover
&.on
$card-bg2(0.8, 0.4)
.count .count
font-size .12rem font-size .12rem
font-weight bold font-weight bold
......
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, computed, watch } from 'vue' import { defineComponent, ref, computed } from 'vue'
import store from '@/store' import store from '@/store'
export default defineComponent({ export default defineComponent({
name: 'CaseAnalysis', name: 'CaseAnalysis',
...@@ -54,20 +54,6 @@ export default defineComponent({ ...@@ -54,20 +54,6 @@ export default defineComponent({
]) ])
const curOption = ref('month') const curOption = ref('month')
watch(
() => curOption.value,
(time) => {
if (!time) return
store.dispatch('GET_CASE_CLASSIFICATION_RANK', {
managementType: '综合',
})
store.dispatch('GET_MOREHAPPEN_ADDR', {
managementType: '综合',
})
},
{ immediate: true }
)
const rankList = computed(() => { const rankList = computed(() => {
const data = store.state.analysisRank[curOption.value] || [] const data = store.state.analysisRank[curOption.value] || []
const total = data.reduce((acc, cur) => acc + cur.num, 0) const total = data.reduce((acc, cur) => acc + cur.num, 0)
......
...@@ -31,7 +31,6 @@ import store from '@/store' ...@@ -31,7 +31,6 @@ import store from '@/store'
export default defineComponent({ export default defineComponent({
name: 'Company', name: 'Company',
setup() { setup() {
store.dispatch('GET_PUBLICSAFE_TRUE_COMPANY')
const trueCompany = computed(() => store.state.pubulicSafeTrueCompany) const trueCompany = computed(() => store.state.pubulicSafeTrueCompany)
const showChart = computed(() => store.state.curTheme === 'safety') const showChart = computed(() => store.state.curTheme === 'safety')
......
...@@ -66,22 +66,12 @@ ...@@ -66,22 +66,12 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, computed, watch } from 'vue' import { defineComponent, ref, computed, watch } from 'vue'
import moment from 'moment'
import { ChartTypes } from '@/components/MyComponent' import { ChartTypes } from '@/components/MyComponent'
import store from '@/store' import store from '@/store'
export default defineComponent({ export default defineComponent({
name: 'Complain', name: 'Complain',
setup() { setup() {
store.dispatch('GET_YOUSUBIDA_RANK')
store.dispatch('GET_YOUSUBIDA_CLASSIFICATION_RANK', '综合')
store.dispatch('GET_URGENTCASE', {
bxmaintainType: '1',
status_in: '待派遣,已派单',
acceptTime_gte: moment(new Date()).format('YYYY-MM-DD'),
pageSize: 1000,
})
const rank = computed(() => store.state.yousubidaRank) const rank = computed(() => store.state.yousubidaRank)
const classificationRank = computed(() => store.state.classificationRank) const classificationRank = computed(() => store.state.classificationRank)
const urgentCase = computed(() => store.state.urgentCase) const urgentCase = computed(() => store.state.urgentCase)
......
...@@ -3,9 +3,9 @@ ...@@ -3,9 +3,9 @@
<div> <div>
<m-sub2>为老服务</m-sub2> <m-sub2>为老服务</m-sub2>
<div class="old"> <div class="old">
<div v-for="item in forOld" :key="item.name"> <div v-for="item in forOld" :key="item.facilitiesType">
<p>{{ item.name }}</p> <p>{{ item.facilitiesType }}</p>
<m-count class="count" :value="item.value" /> <m-count class="count" :value="item.num" />
</div> </div>
</div> </div>
</div> </div>
...@@ -17,34 +17,49 @@ ...@@ -17,34 +17,49 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from 'vue' import { computed, defineComponent } from 'vue'
import Brief, { BriefProp } from '../components/brief.vue' import Brief from '../components/brief.vue'
import icon27 from '@/assets/images/icon27.png' import icon27 from '@/assets/images/icon27.png'
import icon28 from '@/assets/images/icon28.png' import icon28 from '@/assets/images/icon28.png'
import icon29 from '@/assets/images/icon29.png' import icon29 from '@/assets/images/icon29.png'
import icon30 from '@/assets/images/icon30.png' import icon30 from '@/assets/images/icon30.png'
import img3 from '@/assets/images/img3.png'
import store from '@/store'
export default defineComponent({ export default defineComponent({
name: 'Convenient', name: 'Convenient',
components: { Brief }, components: { Brief },
setup() { setup() {
const forOld = ref([ const forOld = computed(() => store.state.oldService)
{ name: '综合为老服务', value: 26 }, const convenientList = computed(() => store.state.lifeConvenient)
{ name: '长者照护之家', value: 64 }, function getNum(name: string): number {
{ name: '睦邻中心', value: 331 }, const result = convenientList.value.find((e) => e.labelName === name)
{ name: '日托所', value: 157 }, return (result && result.num) || 0
{ name: '洗衣房', value: 91 }, }
{ name: '敬老院', value: 53 }, const forLive = computed(() => {
{ name: '老年活动室', value: 38 }, return [
{ name: '助餐点', value: 87 }, {
{ name: '助浴点', value: 68 }, name: '菜场',
]) value: getNum('菜场'),
const forLive = ref<BriefProp[]>([ icon: icon27,
{ name: '菜场', value: 26, icon: icon27 }, },
{ name: '街面废物箱', value: 64, icon: icon28 }, {
{ name: '公厕', value: 18, icon: icon29 }, name: '便利店',
{ name: '电话亭', value: 12, icon: icon30 }, value: getNum('便利店'),
]) icon: img3,
},
{
name: '公厕',
value: getNum('公厕'),
icon: icon29,
},
{
name: '药房',
value: getNum('药房'),
icon: icon30,
},
]
})
return { return {
forOld, forOld,
forLive, forLive,
......
...@@ -66,21 +66,11 @@ ...@@ -66,21 +66,11 @@
import { computed, defineComponent, ref } from 'vue' import { computed, defineComponent, ref } from 'vue'
import Brief from '../components/brief.vue' import Brief from '../components/brief.vue'
import store from '@/store' import store from '@/store'
import moment from 'moment'
export default defineComponent({ export default defineComponent({
name: 'Demand', name: 'Demand',
components: { Brief }, components: { Brief },
setup() { setup() {
store.dispatch('GET_TODAYCASE')
store.dispatch('GET_STAGECASE')
store.dispatch('GET_WORKSTATION')
store.dispatch('GET_TRACKEVENT', {
status_in: '待处置,已签收',
acceptTime_gte: moment(new Date()).format('YYYY-MM-DD'),
pageSize: 1000,
})
const todayCase = computed(() => store.state.todayCase) const todayCase = computed(() => store.state.todayCase)
const stageCase = computed(() => store.state.stageCase) const stageCase = computed(() => store.state.stageCase)
const workstationKind = computed(() => store.state.workstationKind) const workstationKind = computed(() => store.state.workstationKind)
......
<template> <template>
<m-card title="生态"> <m-card title="生态">
<div class="detail"> <div class="detail">
<div v-for="item in ecologyList" :key="item.name"> <div v-for="item in ecologyList" :key="item.labelName">
<m-count class="count orange-count" :value="item.value" /> <m-count class="count orange-count" :value="item.num" />
<p>{{ item.name }}</p> <p>{{ item.labelName }}</p>
</div> </div>
</div> </div>
<m-sub2>便民设施</m-sub2> <m-sub2>便民设施</m-sub2>
...@@ -18,27 +18,71 @@ ...@@ -18,27 +18,71 @@
</div> </div>
<div> <div>
<m-sub2>商业综合体</m-sub2> <m-sub2>商业综合体</m-sub2>
<div class="business photos"> <div class="business">
<img v-for="photo in businessPhotos" :key="photo" :src="photo" /> <img v-for="photo in businessPhotos" :key="photo" :src="photo" />
</div> </div>
</div> </div>
<div> <div>
<m-sub2>历保</m-sub2> <m-sub2>历保</m-sub2>
<div class="history photos"> <div class="history photos">
<img v-for="photo in historyPhotos" :key="photo" :src="photo" /> <m-scroll
v-if="photos1 && photos1.length > 0"
:length="Math.ceil(photos1.length / 3)"
mode="2"
:step="0.76"
:limit="2"
>
<div
v-for="(_, index) in Math.ceil(photos1.length / 3)"
:key="index"
class="wrapper"
>
<div
v-for="photo in photos1.slice(index * 3, index * 3 + 3)"
:key="photo.id"
:name="`${index * 3}, ${index * 3 + 3}`"
class="photo"
:style="`background-image:url('${photo.photoUrl}')`"
>
<p :title="photo.buildingName">{{ photo.buildingName }}</p>
</div>
</div>
</m-scroll>
</div> </div>
</div> </div>
<div> <div>
<m-sub2>文保</m-sub2> <m-sub2>文保</m-sub2>
<div class="history photos"> <div class="history photos">
<img v-for="photo in historyPhotos" :key="photo" :src="photo" /> <m-scroll
v-if="photos2 && photos2.length > 0"
:length="Math.ceil(photos2.length / 3)"
mode="2"
:step="0.76"
:limit="2"
>
<div
v-for="(_, index) in Math.ceil(photos2.length / 3)"
:key="index"
class="wrapper"
>
<div
v-for="photo in photos2.slice(index * 3, index * 3 + 3)"
:key="photo.id"
:name="`${index * 3}, ${index * 3 + 3}`"
class="photo"
:style="`background-image:url('${photo.photoUrl}')`"
>
<p :title="photo.buildingName">{{ photo.buildingName }}</p>
</div>
</div>
</m-scroll>
</div> </div>
</div> </div>
</m-card> </m-card>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from 'vue' import { defineComponent, ref, computed } from 'vue'
import img1 from '@/assets/images/img1.png' import img1 from '@/assets/images/img1.png'
import img2 from '@/assets/images/img2.png' import img2 from '@/assets/images/img2.png'
import img3 from '@/assets/images/img3.png' import img3 from '@/assets/images/img3.png'
...@@ -49,36 +93,53 @@ import img7 from '@/assets/images/img7.png' ...@@ -49,36 +93,53 @@ import img7 from '@/assets/images/img7.png'
import img8 from '@/assets/images/img8.png' import img8 from '@/assets/images/img8.png'
import photo1 from '@/assets/images/photo1.png' import photo1 from '@/assets/images/photo1.png'
import photo2 from '@/assets/images/photo2.png' import photo2 from '@/assets/images/photo2.png'
import photo3 from '@/assets/images/photo3.png' import store from '@/store'
import photo4 from '@/assets/images/photo4.png'
import photo5 from '@/assets/images/photo5.png'
export default defineComponent({ export default defineComponent({
name: 'Ecology', name: 'Ecology',
setup() { setup() {
const ecologyList = ref([ const ecologyList = computed(() => store.state.ecologyList)
{ name: '衣', value: 853 }, const sumList = computed(() => {
{ name: '行', value: 1276 }, return store.state.ecologyConvenient.map((item) => {
{ name: '食', value: 1276 }, return {
{ name: '住', value: 853 }, name: item.labelName,
]) value: item.num,
const sumList = ref([ icon: whichIcon(item.labelName),
{ name: '为老设施', value: 853, icon: img1 }, }
{ name: '便民商店', value: 1276, icon: img2 }, })
{ name: '便利店', value: 285, icon: img3 }, })
{ name: '电话亭', value: 853, icon: img4 }, function whichIcon(name: string): string {
{ name: '餐车', value: 1276, icon: img5 }, switch (name) {
{ name: '街面废物箱', value: 285, icon: img6 }, case '便利店':
{ name: '公厕', value: 200, icon: img7 }, return img3
{ name: '垃圾箱房', value: 1957, icon: img8 }, case '公厕':
]) return img7
case '药房':
return img8
case '菜场':
return img5
case '菜店':
return img2
case '为老设施':
return img1
default:
return img3
}
}
const businessPhotos = ref([photo1, photo2]) const businessPhotos = ref([photo1, photo2])
const historyPhotos = ref([photo3, photo4, photo5]) const photosList = computed(() => store.state.ecologyPhoto)
const photos1 = computed(() =>
photosList.value.filter((e) => e.buildingType.includes('历保'))
)
const photos2 = computed(() =>
photosList.value.filter((e) => e.buildingType.includes('文保'))
)
return { return {
ecologyList, ecologyList,
sumList, sumList,
businessPhotos, businessPhotos,
historyPhotos, photos1,
photos2,
} }
}, },
}) })
...@@ -90,10 +151,10 @@ export default defineComponent({ ...@@ -90,10 +151,10 @@ export default defineComponent({
display flex display flex
width 100% width 100%
justify-content space-around justify-content space-around
flex-wrap wrap
>div >div
display flex $center()
justify-content space-around width 25%
align-items center
.count .count
font-size .14rem font-size .14rem
font-family $font-barlow font-family $font-barlow
...@@ -116,11 +177,39 @@ export default defineComponent({ ...@@ -116,11 +177,39 @@ export default defineComponent({
p p
color #ccc color #ccc
.photos .photos
height .76rem
margin-bottom .02rem
overflow hidden
.wrapper
width 100%
display flex display flex
justify-content space-between justify-content space-between
>img flex-wrap wrap
width 30% .photo
&.business width 31%
height .76rem
position relative
background-repeat no-repeat
background-size cover
background-position center
>p
position absolute
left 0
right 0
bottom 0
height .2rem
line-height @height
background rgba(0,0,0,0.6)
text-align center
overflow hidden
white-space nowrap
text-overflow ellipsis
padding 0 .04rem
box-sizing border-box
.business
display flex
justify-content space-between
margin-bottom .02rem
>img >img
width 48% width 48%
</style> </style>
...@@ -104,11 +104,6 @@ export default defineComponent({ ...@@ -104,11 +104,6 @@ export default defineComponent({
components: { Summary }, components: { Summary },
setup() { setup() {
const showChart = computed(() => store.state.curTheme === 'safety') const showChart = computed(() => store.state.curTheme === 'safety')
store.dispatch('GET_PUBLICSAFE_SOS_MATERIAL')
store.dispatch('GET_PUBLICSAFE_OUTHOUSEWALL')
store.dispatch('GET_PUBLICSAFE_BUILDINGS')
store.dispatch('GET_PUBLICSAFE_PIEDATA')
const listModal = ref(false) const listModal = ref(false)
const SOSMaterail = computed(() => store.state.pubulicSafeSOSMaterail) const SOSMaterail = computed(() => store.state.pubulicSafeSOSMaterail)
const pieData = computed(() => store.state.pubulicSafePieData) const pieData = computed(() => store.state.pubulicSafePieData)
......
...@@ -60,8 +60,6 @@ export default defineComponent({ ...@@ -60,8 +60,6 @@ export default defineComponent({
name: 'House', name: 'House',
components: { Brief }, components: { Brief },
setup() { setup() {
store.dispatch('GET_PUBLICSAFE_HOUSE')
store.dispatch('GET_PUBLICSAFE_NONRESIDENT')
const pubulicSafeHouse = computed(() => store.state.pubulicSafeHouse) const pubulicSafeHouse = computed(() => store.state.pubulicSafeHouse)
const pubulicSafeNonResident = computed( const pubulicSafeNonResident = computed(
() => store.state.pubulicSafeNonResident () => store.state.pubulicSafeNonResident
......
...@@ -79,9 +79,6 @@ export default defineComponent({ ...@@ -79,9 +79,6 @@ export default defineComponent({
name: 'Police', name: 'Police',
components: { Brief, Summary }, components: { Brief, Summary },
setup() { setup() {
store.dispatch('GET_PUBLICSAFE_RIGHT_GATE')
store.dispatch('GET_PUBLICSAFE_RIGHT_SAFEMAP')
store.dispatch('GET_PUBLICSAFE_NEWFIND')
const newFind = computed(() => store.state.pubulicSafeNewFindNum) const newFind = computed(() => store.state.pubulicSafeNewFindNum)
const searchModal = ref(false) const searchModal = ref(false)
const showChart = computed(() => store.state.curTheme === 'safety') const showChart = computed(() => store.state.curTheme === 'safety')
......
...@@ -26,7 +26,6 @@ export default defineComponent({ ...@@ -26,7 +26,6 @@ export default defineComponent({
name: 'Population', name: 'Population',
components: { Brief }, components: { Brief },
setup() { setup() {
store.dispatch('GET_PUBLICSAFE_TRUE_PEOPLE')
const truePeople = computed(() => store.state.pubulicSafeTruePeople) const truePeople = computed(() => store.state.pubulicSafeTruePeople)
const summary = computed(() => { const summary = computed(() => {
......
...@@ -63,6 +63,7 @@ export default defineComponent({ ...@@ -63,6 +63,7 @@ export default defineComponent({
// .duty, // .duty,
// .analysis // .analysis
// flex: 1 // flex: 1
.beauty,
.entry, .entry,
.task .task
flex 1 flex 1
......
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