Commit 9a74ec80 authored by 郭铭瑶's avatar 郭铭瑶 🤘

对接部分接口

parent 58a757aa
......@@ -20,11 +20,14 @@ switch (process.env.NODE_ENV) {
export default {
BASE_URL,
SOURCE_URL,
TEST: '/service-basicdatasync-ddd/communities',
GET_COMMUNITY_DETAIL: '/service-basicdatasync-ddd/communities',
GET_BUILDING: '/service-basicdatasync-ddd/building', // 门牌幢列表
GET_INDUSTRY_AUTHORITY: '/service-basicdatasync-ddd/indCous', // 业委会列表
GET_COMMITTEE: '/service-basicdatasync-ddd/residentsCommittees', // 居委会列表
GET_COMPANY: '/service-basicdatasync-ddd/propCompanies', // 物业列表
GET_CASE: '/service-special-nandong/compairs', // 案件汇总列表
GET_CASE_DETAIL: '/service-special-nandong/compair', // 案件详情
GET_PUBLICSAFE_RIGHT_GATE: '/service-special-nandong/ironGate/statistical', // 公共安全-右侧-门岗分布
GET_PUBLICSAFE_RIGHT_SAFEMAP: '/service-special-nandong/peaceMaps', // 公共安全-右侧-平安地图
GET_PUBLICSAFE_TRUE_PEOPLE: '/service-special-nandong/personnel/statistical', // 公共安全-右侧-实有人口
......@@ -78,11 +81,15 @@ export default {
GET_TRACKEVENT: '/service-special-nandong/compairs', // 有求必应-事件跟踪
GET_CASE_CLASSIFICATION_RANK: '/service-special-nandong/compair/analysis', // 案件分析-分类排行
GET_MOREHAPPEN_ADDR: '/service-special-nandong/compair/analysis/addr', // 案件分析-多发地点
GET_RESPONSIVITY: '/service-special-nandong/compair/responsivity', // 响应度
GET_ENTRY: '/service-special-nandong/inputUrl', // 业务入口
/** 公共服务 */
GET_ECOLOGY_LIST: '/service-basicdatasync-ddd/nonResident/ecological', // 生态-衣食住行
GET_ECOLOGY_POINTS: '/service-basicdatasync-ddd/nonResidents', // 获取衣食住行撒点
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', // 美丽家园 - 根据名称查询列表
GET_TOILET: '/service-special-nandong/toilet/renovation', // 马桶改造
}
......@@ -8,8 +8,14 @@
draggable="false"
@click="closeDrawer"
/>
<div class="wrap">
<img class="dot" src="@/assets/images/dot2.png" />
<img class="dot" src="@/assets/images/dot2.png" />
<img class="dot" src="@/assets/images/dot2.png" />
<img class="dot" src="@/assets/images/dot2.png" />
<div class="content"><slot /></div>
</div>
</div>
</MyAnimate>
</teleport>
</template>
......@@ -55,14 +61,12 @@ export default defineComponent({
<style lang="stylus" scoped>
@import '../main.styl'
.my-drawer
background url('@/assets/images/drawer-bg.png') 100% / 100% 100% no-repeat
background-color $table-title-bg
position fixed
top .45rem
right .05rem
bottom @right
z-index 9999
padding .15rem .25rem
$blur()
color #fff
.close-btn
......@@ -76,4 +80,29 @@ export default defineComponent({
transition transform .3s ease
&:hover
transform scale(1.2)
.wrap
position relative
border .01rem dotted rgba(47,134,238, .6)
margin .06rem
padding .06rem
.dot
position absolute
width .1rem
height @width
&:nth-of-type(1)
left 0
top 0
transform translate(-50%, -50%)
&:nth-of-type(2)
right 0
top 0
transform translate(50%, -50%)
&:nth-of-type(3)
left 0
bottom 0
transform translate(-50%, 50%)
&:nth-of-type(4)
right 0
bottom 0
transform translate(50%, 50%)
</style>
......@@ -105,7 +105,7 @@ export default defineComponent({
if (formatter && key.match(/>(\w*)[#\*:]?/)) {
return formatter[RegExp.$1](data[dataKey])
}
return data[dataKey] || ''
return data[dataKey] || ''
}
const calcAlign = (key: string): string => {
......
......@@ -15,13 +15,8 @@
class="my-modal"
:style="`width:${width};transform: translateX(${offset}) translateY(${translateY})`"
>
<span class="edge left-top" />
<span class="edge right-top" />
<span class="edge left-bottom" />
<span class="edge right-bottom" />
<div class="inner">
<head>
<img draggable="false" src="@/assets/images/modal-head-tri.png" />
<p>{{ title }}</p>
<img
draggable="false"
......@@ -29,12 +24,18 @@
@click.prevent="closeModal"
/>
</head>
<div class="wrap">
<img class="dot" src="@/assets/images/dot2.png" />
<img class="dot" src="@/assets/images/dot2.png" />
<img class="dot" src="@/assets/images/dot2.png" />
<img class="dot" src="@/assets/images/dot2.png" />
<div class="content">
<slot />
</div>
</div>
</div>
</div>
</div>
</MyAnimate>
</teleport>
</template>
......@@ -78,7 +79,7 @@ export default defineComponent({
},
maskClosable: {
type: Boolean as PropType<boolean>,
default: true,
default: false,
},
},
emits: ['update:modelValue', 'close'],
......@@ -108,70 +109,77 @@ export default defineComponent({
.my-modal
color #fff
z-index 99999
padding 0.04rem
padding 0.06rem
background transparent
position relative
box-sizing border-box
$blur(0.01rem)
.edge
display block
position absolute
width 0.1rem
height @width
border 0.01rem solid $secondary-color
&.left-top
top 0
left 0
border-right none
border-bottom none
&.right-top
top 0
right 0
border-left none
border-bottom none
&.left-bottom
bottom 0
left 0
border-right none
border-top none
&.right-bottom
bottom 0
right 0
border-left none
border-top none
.inner
$blur()
background rgba(6, 34, 67, 0.8)
border 0.01rem solid rgba(91, 213, 255, 0.3)
background rgba(29, 42, 65, 0.9)
padding-bottom .02rem
box-sizing border-box
head
height 0.28rem
background url('@/assets/images/modal-head-bg.png') 100% / 100% 100% no-repeat
min-height .24rem
box-sizing border-box
display flex
align-items center
justify-content space-between
background linear-gradient(to right, rgba(59,85,102,.8), transparent)
position relative
border-bottom .01rem solid rgba(105,110,114,.3)
margin-bottom .05rem
padding 0 .1rem
box-sizing border-box
&:before
content ''
display block
position absolute
left 0
width .02rem
height 60%
background #FADB71
>p
font-size 0.14rem
font-family $font-zcool
text-indent 0.14rem
line-height 1.5
>img
width 0.14rem
height @width
position absolute
&:nth-of-type(1)
width 0.24rem
width 0.1rem
height @width
left -0.095rem
&:nth-of-type(2)
right 0.05rem
cursor pointer
transition transform 0.3s ease-in-out
&:hover
transform rotate(180deg)
.wrap
position relative
border .01rem dotted rgba(47,134,238, .6)
margin .06rem
padding .06rem
.dot
position absolute
width .1rem
height @width
&:nth-of-type(1)
left 0
top 0
transform translate(-50%, -50%)
&:nth-of-type(2)
right 0
top 0
transform translate(50%, -50%)
&:nth-of-type(3)
left 0
bottom 0
transform translate(-50%, 50%)
&:nth-of-type(4)
right 0
bottom 0
transform translate(50%, 50%)
.content
min-height 30vh
// min-height 30vh
max-height 80vh
padding 0.1rem
overflow-y auto
overflow-x hidden
font-size 0.1rem
box-sizing border-box
</style>
......@@ -8,8 +8,8 @@
<span v-if="addition.unit">{{ addition.unit }}</span>
<img src="@/assets/images/title-dec.png" />
</div>
<div v-if="searchAble" class="search-container">
<input
v-if="searchAble"
v-model="inputValue"
:class="{ open: isOpened }"
class="search-bar"
......@@ -17,13 +17,20 @@
@keypress.enter="handleSearch"
/>
<img
v-if="searchAble"
v-show="isOpened"
class="close-btn"
src="@/assets/images/close-btn2.png"
draggable="false"
@click.prevent="handleClose"
/>
<img
class="search-btn"
src="@/assets/images/search.png"
draggable="false"
@click.prevent="handleOpenSearchBar"
/>
</div>
</div>
<!-- <img src="@/assets/images/sub-dot.png" draggable="false" /> -->
<span class="dot" />
</div>
......@@ -52,13 +59,17 @@ export default defineComponent({
default: false,
},
},
emits: ['search'],
setup(props, ctx) {
emits: ['search', 'close'],
setup(_, ctx) {
const isOpened = ref(false)
const inputValue = ref('')
const handleSearch = () => {
ctx.emit('search', inputValue.value.trim())
}
const handleClose = () => {
inputValue.value = ''
ctx.emit('close')
}
const handleOpenSearchBar = () => {
if (!isOpened.value) {
isOpened.value = true
......@@ -74,6 +85,7 @@ export default defineComponent({
isOpened,
inputValue,
handleSearch,
handleClose,
handleOpenSearchBar,
}
},
......@@ -110,6 +122,10 @@ export default defineComponent({
img
width .3rem
margin-left .1rem
.search-container
display flex
align-items center
position relative
.search-bar
display block
width 0
......@@ -125,19 +141,26 @@ export default defineComponent({
transition all .3s ease-in-out
opacity 0
&.open
width 1rem
padding .02rem .05rem
width 1.6rem
padding .02rem .16rem .02rem .05rem
border .01rem solid $blue
opacity 1
.search-btn
width .14rem
height @width
cursor pointer
transition transform .3s ease-in-out
transition transform .2s ease-in-out
&:hover
transform scale(1.3) rotate(360deg)
.close-btn
width .08rem
height @width
cursor pointer
position absolute
right .24rem
transition transform .2s ease-in-out
&:hover
transform scale(1.3) rotate(360deg)
// >img
// width .6rem
>.dot
display inline-block
width 0
......
<template>
<div class="my-table">
<div class="my-table" :class="{ stripe: stripe }">
<div class="table-title">
<div
v-for="(title, index) in layout.header"
......@@ -77,6 +77,10 @@ export default defineComponent({
type: Boolean as PropType<boolean>,
default: false,
},
stripe: {
type: Boolean as PropType<boolean>,
default: false,
},
},
emits: ['select'],
setup(props, ctx) {
......@@ -154,6 +158,21 @@ export default defineComponent({
<style lang="stylus" scoped>
@import '../main.styl'
.my-table
position relative
&.stripe
.table-title
background $table-title-bg
color $blue
box-shadow none
border-radius 0
.table-content
>div
background $table-content-bg
box-shadow none
border-radius 0
margin-top 0
&:nth-child(odd)
background transparent
$full()
p
padding .05rem
......@@ -161,21 +180,27 @@ export default defineComponent({
flex 1
box-sizing border-box
.table-title
$blur(0.1rem)
display flex
background $table-title-bg
color $blue
background rgba(114,123,132, .5)
box-shadow 0 0 .04rem 0 rgba(44,51,70,.65), inset 0 .01rem .02rem 0 rgba(204,204,204,.2)
border-radius .04rem
font-weight bold
font-size .12rem
box-sizing inherit
position sticky
top 0
>div
box-sizing inherit
.table-content
>div
display flex
align-items center
background $table-content-bg
box-sizing inherit
&:nth-child(odd)
background transparent
background rgba(70,83,97,.45)
box-shadow 0 0 .04rem 0 rgba(44,51,70,.65)
margin-top .06rem
border-radius .04rem
&.selectable
cursor pointer
&:hover
......
......@@ -37,8 +37,8 @@ $card-title-color = #fff
$card-title-size = .14rem
$card-border = .01rem solid $primary-border
$table-title-bg =rgba(2,27,53,.5)
$table-content-bg = rgba(2,27,53,.2)
$table-title-bg =rgba(2,27,53,.8)
$table-content-bg = rgba(2,27,53,.6)
$table-content-hover-color = $primary-color
$table-content-hover-bg = $primary-bg
......
......@@ -19,7 +19,7 @@ export default {
bxmaintainType: '1',
status_in: '待派遣,已派单',
acceptTime_gte: today,
pageSize: 1000,
pageSize: 100,
})
dispatch('GET_TODAYCASE')
dispatch('GET_STAGECASE')
......@@ -27,7 +27,7 @@ export default {
dispatch('GET_TRACKEVENT', {
status_in: '待处置,已签收',
acceptTime_gte: today,
pageSize: 1000,
pageSize: 100,
})
dispatch('GET_CASE_CLASSIFICATION_RANK', {
managementType: '综合',
......@@ -35,6 +35,8 @@ export default {
dispatch('GET_MOREHAPPEN_ADDR', {
managementType: '综合',
})
dispatch('GET_RESPONSIVITY')
dispatch('GET_ENTRY')
dispatch('GET_PUBLICSAFE_SOS_MATERIAL')
dispatch('GET_PUBLICSAFE_OUTHOUSEWALL')
dispatch('GET_PUBLICSAFE_BUILDINGS')
......@@ -66,9 +68,15 @@ export default {
},
// 案件汇总列表
async getCaseList({ commit }: { commit: Commit }): Promise<void> {
async getCaseList(
{ commit }: { commit: Commit },
address = null
): Promise<void> {
const { content } = (
await ajax.get({ url: api.GET_CASE, params: { pageSize: 100 } })
await ajax.get({
url: api.GET_CASE,
params: { pageSize: 200, address_l: address },
})
).data
commit('SET_CASE_LIST', content)
},
......@@ -161,7 +169,7 @@ export default {
commit('SET_PUBLICSAFE_GATESENTRY_ZHIGUANGONGFANG', publicHouse)
},
// 公共服务 - 门岗值守 - 平安地图
// 公共安全 - 门岗值守 - 平安地图
async GET_PUBLICSAFE_RIGHT_SAFEMAP({
commit,
}: {
......@@ -263,7 +271,7 @@ export default {
commit('SET_PUBLICSAFE_OUTHOUSEWALL', content)
},
// 公共服务 - 重点关注楼宇
// 公共安全 - 重点关注楼宇
async GET_PUBLICSAFE_BUILDINGS({
commit,
}: {
......@@ -291,6 +299,18 @@ export default {
const { content } = (await ajax.get({ url: api.GET_ECOLOGY_LIST })).data
commit('SET_ECOLOGY_LIST', content)
},
async getEcologyPoints(
{ commit }: { commit: Commit },
name: string
): Promise<void> {
const { content } = (
await ajax.get({
url: api.GET_ECOLOGY_POINTS,
params: { labelName: name },
})
).data
commit('SET_ECOLOGY_POINTS', content)
},
async getEcologyConvenient({ commit }: { commit: Commit }): Promise<void> {
const { content } = (
await ajax.get({ url: api.GET_ECOLOGY_CONVENIENT })
......@@ -401,7 +421,7 @@ export default {
const { content } = (
await ajax.get({
url: api.GET_COMBINE_LIST,
params: { bigscreenCommunityId: id, pageSize: 1000 },
params: { bigscreenCommunityId: id, pageSize: 200 },
})
).data
commit('SET_COMBINE_DATA', content)
......@@ -528,6 +548,12 @@ export default {
},
/** 公共管理 */
// 业务入口
async GET_ENTRY({ commit }: { commit: Commit }): Promise<void> {
const { content } = (await ajax.get({ url: api.GET_ENTRY })).data
commit('SET_ENTRY', content)
},
async GET_YOUSUBIDA_RANK({ commit }: { commit: Commit }): Promise<void> {
// 有诉必答 - 占比
const { content } = (await ajax.get({ url: api.GET_YOUSUBIDA_RANK })).data
......@@ -684,4 +710,14 @@ export default {
).data
commit('SET_MOREHAPPEN_ADDR', content)
},
//响应度
async GET_RESPONSIVITY({ commit }: { commit: Commit }): Promise<void> {
const { content } = (
await ajax.get({
url: api.GET_RESPONSIVITY,
})
).data
commit('SET_RESPONSIVITY', content)
},
}
......@@ -82,6 +82,19 @@ export interface ElevCountProp {
num: number
}
export interface ResponsivityProp {
date: string
statistical: {
totalNum: number
reachNum: number
}
}
export interface EntryProp {
inputName: string
url: string
}
export interface GlobalStateProps {
showLoading: boolean
curView: ViewType
......@@ -142,11 +155,14 @@ export interface GlobalStateProps {
analysisRank: Partial<DutyDataProp>
moreHappenAddr: Partial<DutyDataProp>
ecologyList: EcologyListProp[]
ecologyPoints: any[]
ecologyConvenient: EcologyListProp[]
ecologyPhoto: EcologyPhotoProp[]
oldService: ForOldProp[]
lifeConvenient: EcologyListProp[]
elevCount: ElevCountProp[]
responsivity: ResponsivityProp[]
entry: EntryProp[]
}
export default createStore<GlobalStateProps>({
......
......@@ -12,6 +12,8 @@ import {
EcologyPhotoProp,
ForOldProp,
ElevCountProp,
ResponsivityProp,
EntryProp,
} from './index'
export default {
......@@ -203,6 +205,9 @@ export default {
},
/** 公共管理 */
SET_ENTRY(state: GlobalStateProps, data: EntryProp[]): void {
state.entry = data
},
// 有诉必答-占比
SET_YOUSUBIDA_RANK(state: GlobalStateProps, data: YousubidaRankProp): void {
state.yousubidaRank = data
......@@ -257,11 +262,18 @@ export default {
SET_MOREHAPPEN_ADDR(state: GlobalStateProps, data: DutyDataProp): void {
state.moreHappenAddr = data
},
// 响应度
SET_RESPONSIVITY(state: GlobalStateProps, data: ResponsivityProp[]): void {
state.responsivity = data
},
/** 公共服务 - 生态 */
SET_ECOLOGY_LIST(state: GlobalStateProps, data: EcologyListProp[]): void {
state.ecologyList = data
},
SET_ECOLOGY_POINTS(state: GlobalStateProps, data: any[]): void {
state.ecologyPoints = data
},
SET_ECOLOGY_CONVENIENT(
state: GlobalStateProps,
data: EcologyListProp[]
......
......@@ -220,9 +220,12 @@ export default {
analysisRank: { day: [], week: [], month: [] },
moreHappenAddr: { day: [], week: [], month: [] },
ecologyList: [],
ecologyPoints: [],
ecologyConvenient: [],
ecologyPhoto: [],
oldService: [],
lifeConvenient: [],
elevCount: [],
responsivity: [],
entry: [],
} as GlobalStateProps
......@@ -165,6 +165,8 @@ export default defineComponent({
}
const map = ref<any>(null)
onMounted(async () => {
console.log('route', route)
curId.value = route.query.id || communityOptions.value[0].type
initData(curId.value)
store.commit(
......
......@@ -19,7 +19,7 @@
</a-tooltip>
</template>
</div>
<m-modal v-model="searchModal" title="搜索" width="30%" offset="-70%">
<m-modal v-model="searchModal" title="搜索" width="20%" offset="-70%">
<div id="modal-search-bar">
<span class="edge left-top" />
<span class="edge right-top" />
......@@ -29,30 +29,35 @@
<a-select v-model:value="searchType">
<a-select-option value="case">案件</a-select-option>
<a-select-option value="population">人口</a-select-option>
<a-select-option value="house">房屋</a-select-option>
</a-select>
<a-input v-model:value="searchKey" placeholder="请输入搜索关键词" />
<a-input
v-model:value="searchKey"
placeholder="请输入搜索关键词"
@pressEnter="handleSearch"
/>
</a-input-group>
<div class="search-btn">搜索</div>
<div class="search-btn" @click="handleSearch">搜索</div>
</div>
<div class="modal-case-content">
<div
v-for="(item, i) in caseList"
:key="i"
:class="{ done: item.status === 1 }"
>
<div>
<p>
<span>{{ item.troubleType }}</span>
{{ item.address }}
</p>
<p>{{ item.acceptTime }} ~ {{ item.backTime }}</p>
</div>
<div>{{ item.reportContent }}</div>
<div v-if="item.status === '已结'" class="flag">已结案</div>
<div v-else class="flag">处置中</div>
<template v-if="caseList.length > 0">
<div v-for="(item, i) in caseList" :key="i" @click="handleSelect(item)">
<span :class="getStyle(item.managementType)">{{
item.managementType
}}</span>
<p>{{ item.address }}</p>
</div>
</template>
<m-empty v-else />
</div>
</m-modal>
<m-drawer v-model="caseModal">
<CaseDrawer
:community-info="communityInfo"
:property-info="propertyInfo"
:case-info="caseInfo"
/>
</m-drawer>
</template>
<script lang="ts">
......@@ -68,10 +73,13 @@ import d2 from '@/assets/images/2d.png'
import d3 from '@/assets/images/3d.png'
import zoomIn from '@/assets/images/zoom-in.png'
import zoomOut from '@/assets/images/zoom-out.png'
import CaseDrawer from '@/view/drawers/case-drawer.vue'
import store from '@/store'
import { ajax, api } from '@/ajax'
export default defineComponent({
name: 'MapBtns',
components: { CaseDrawer },
emits: ['full', 'change', 'zoom'],
setup(_, ctx) {
const curViewType = computed(() => store.state.curView.type)
......@@ -81,7 +89,7 @@ export default defineComponent({
? { key: '3D', icon: d3, title: '开启3D地图' }
: { key: '2D', icon: d2, title: '开启2D地图' }
const list = [
// { key: 'search', icon: btn1 },
{ key: 'search', icon: btn1 },
{ key: 'in', icon: zoomIn, title: '放大地图' },
{ key: 'out', icon: zoomOut, title: '缩小地图' },
{ key: 'full', icon: btn2, title: '全屏' },
......@@ -98,6 +106,8 @@ export default defineComponent({
})
const fullScreen = ref(false)
const searchModal = ref(false)
const searchType = ref('case')
const searchKey = ref('')
const handleClick = (key: string) => {
switch (key) {
case '3D':
......@@ -112,6 +122,9 @@ export default defineComponent({
break
case 'search':
searchModal.value = true
searchKey.value = ''
searchType.value = 'case'
store.dispatch('getCaseList')
break
case 'in':
case 'out':
......@@ -127,8 +140,6 @@ export default defineComponent({
break
}
}
const searchType = ref('case')
const searchKey = ref('')
const caseList = computed(() => store.state.caseList)
const options = computed(() => {
if (curViewType.value === 'street') {
......@@ -151,6 +162,45 @@ export default defineComponent({
[() => curViewType.value, () => store.state.curMapType],
() => (checkboxValues.value = [])
)
const handleSearch = () => {
const address = searchKey.value
store.dispatch('getCaseList', address)
}
const getStyle = (type: string): string => {
switch (type) {
case '小区':
return 'green'
case '街面':
return 'yellow'
case '综合':
return 'blue'
default:
return ''
}
}
const caseModal = ref(false)
const communityInfo = ref(null)
const propertyInfo = ref(null)
const caseInfo = ref(null)
const handleSelect = async (item: any) => {
const { content } = (
await ajax.get({ url: `${api.GET_CASE_DETAIL}/${item.id}` })
).data
propertyInfo.value = content
if (item.communityId) {
const { content } = (
await ajax.get({
url: api.GET_COMMUNITY_DETAIL,
params: { sectId: item.communityId },
})
).data
communityInfo.value = content && content[0]
}
caseModal.value = true
}
return {
btns,
fullScreen,
......@@ -163,6 +213,13 @@ export default defineComponent({
checkboxValues,
handleChange,
curViewType,
handleSearch,
getStyle,
handleSelect,
caseModal,
communityInfo,
propertyInfo,
caseInfo,
}
},
})
......@@ -252,48 +309,37 @@ $bg = rgba(6,34,67,.4)
font-weight bold
text-decoration underline
.modal-case-content
max-height 60vh
overflow-y auto
overflow-x hidden
>div
position relative
padding .1rem
border $border
border-left .02rem solid $secondary-color
margin-bottom .1rem
overflow hidden
&.done
border-left-color #27C5A2
.flag
background #27C5A2
>div
&:nth-of-type(1)
border-bottom $border
padding-bottom .1rem
margin-bottom .1rem
p
span
display flex
align-items center
background $table-content-bg
padding .04rem
box-sizing border-box
cursor pointer
&:nth-of-type(odd)
background transparent
&:hover
background $table-content-title
color $secondary-color
>span
display inline-block
color orange
border .01rem solid orange
border .01rem solid #fff
border-radius .02rem
margin-right .1rem
padding 0 .03rem
font-size .08rem
&:last-child
color #aaa
font-size .08rem
margin-top .05rem
.flag
background $secondary-color
position absolute
top -0.08rem
right -0.28rem
transform rotate(45deg)
height .4rem
width .8rem
display flex
align-items flex-end
justify-content center
font-weight bold
padding-bottom .02rem
padding 0 .02rem
margin-right .1rem
&.yellow
color $yellow
border-color @color
&.green
color $green
border-color @color
&.blue
color $blue
border-color @color
</style>
<style lang="stylus" scoped>
.map-btns
......
<template>
<div class="sub-title">
<p><slot /></p>
<span />
<img src="@/assets/images/title-dec.png" />
<p @click="clickSecTitle"><slot name="secTitle" /></p>
</div>
</template>
......@@ -31,12 +31,9 @@ export default defineComponent({
align-items center
margin 0.04rem 0
p
color $secondary-color
margin-right 0.1rem
font-weight bold
span
flex 1
display block
height 0.01rem
background $primary-border
font-size .12rem
font-family $font-zcool
img
width .26rem
margin-left .1rem
</style>
<template>
<div class="case-drawer">
<m-card title="房屋档案">
<m-card title="相关案件">
<SubTitle>小区信息</SubTitle>
<m-form
:template="[
'name:小区名称',
'stNameFrst:小区名称',
'address:小区地址',
'belong:所属居委会',
'buildingNum:总门牌幢数',
'roomNum:总户数',
'buidlingArea:总建筑面积',
'area:占地面积',
'rang:小区四至范围',
'excludeRang:小区四至范围不包括',
'cmtName:所属居委会',
'totUnits:总门牌幢数',
'totHous:总户数',
'stCnstArea:总建筑面积',
'landArea:占地面积',
'range:小区四至范围',
'stNotcsparea:小区四至范围不包括',
]"
:data="formData"
:data="communityData"
label-width="1.4rem"
/>
<SubTitle>物业信息</SubTitle>
<m-form
:template="[
'name:小区名称',
'address:小区地址',
'belong:所属居委会',
'buildingNum:总门牌幢数',
'roomNum:总户数',
'buidlingArea:总建筑面积',
'area:占地面积',
'rang:小区四至范围',
'excludeRang:小区四至范围不包括',
'cspName:物业企业名称',
'hpbName:注册区县',
'registerAddress:注册地址',
'orgCode:组织机构代码',
'legalRepName:法人代表',
'cspContacter:企业联系人',
'cspTel:企业联系人电话',
'cspFax:企业联系人传真',
'bizLicenseValidDate:营业执照有效期',
'bizLicenseCode:营业执照号',
]"
:data="formData"
:data="propertyData"
label-width="1.4rem"
/>
</m-card>
......@@ -56,7 +57,7 @@
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
import { computed, defineComponent, PropType, ref } from 'vue'
import SubTitle from '../components/sub-title.vue'
import detail1 from '@/assets/images/case-detail1.png'
import detail2 from '@/assets/images/case-detail2.png'
......@@ -64,7 +65,45 @@ import detail2 from '@/assets/images/case-detail2.png'
export default defineComponent({
name: 'CaseDrawer',
components: { SubTitle },
setup() {
props: {
communityInfo: {
type: Object as PropType<{ [key: string]: any }>,
required: true,
},
propertyInfo: {
type: Object as PropType<{ [key: string]: any }>,
required: true,
},
caseInfo: {
type: Object as PropType<{ [key: string]: any }>,
required: true,
},
},
setup(props) {
const communityData = computed(() => {
const { communityInfo, propertyInfo } = props
const keys = [
{ name: '北', key: 'stCspNorth' },
{ name: '南', key: 'stCspSouth' },
{ name: '西', key: 'getStCspWest' },
{ name: '东', key: 'stCspEast' },
]
const range = keys.map((item) =>
communityInfo && communityInfo[item.key]
? item.name + communityInfo[item.key]
: ''
)
return {
...communityInfo,
address: propertyInfo.address,
range: range.join(','),
}
})
const propertyData = computed(() => {
console.log(props.propertyInfo)
return props.propertyInfo
})
const formData = ref({
name: '测试文字',
address: '测试文字',
......@@ -106,6 +145,8 @@ export default defineComponent({
},
])
return {
communityData,
propertyData,
formData,
details,
}
......
......@@ -24,16 +24,27 @@
<m-sub2>马桶改造</m-sub2>
<Brief :list="toiletSituation" color="#fff" />
<m-progress
:value="80"
:value="
Math.round(
(toiletSituation[0].value / toiletSituation[1].value) * 100
)
"
:color="['rgba(253,211,116,.15)', '#F7933E']"
:msg="{ value: 80, unit: '%', name: '改造进度', color: '#fff' }"
:msg="{
value: Math.round(
(toiletSituation[0].value / toiletSituation[1].value) * 100
),
unit: '%',
name: '改造进度',
color: '#fff',
}"
/>
</div>
</m-card>
</template>
<script lang="ts">
import { computed, defineComponent, ref } from 'vue'
import { computed, defineComponent, onMounted, ref } from 'vue'
import Brief, { BriefProp } from '../components/brief.vue'
import store from '@/store'
import icon31 from '@/assets/images/icon31.png'
......@@ -74,9 +85,14 @@ export default defineComponent({
console.log(`美丽街区-加装电梯-${name}区域电梯列表`, content)
}
const toiletSituation = ref<BriefProp[]>([
{ name: '已完成改造', value: 26, icon: icon35 },
{ name: '应改造', value: 64, icon: icon36 },
{ name: '已完成改造', value: 0, icon: icon35 },
{ name: '应改造', value: 0, icon: icon36 },
])
onMounted(async () => {
const { content } = (await ajax.get({ url: api.GET_TOILET })).data
toiletSituation.value[0].value = content.completeNum
toiletSituation.value[1].value = content.totalNum
})
const workStationProjects = ref([
{ name: '架空线梳理', value: 16 },
{ name: '店招店牌美化', value: 26 },
......
<template>
<m-card title="业务入口" :mode="mode">
<div class="content">
<div
v-for="entry in entrys"
:key="entry.type"
@click="routeTo(entry.type)"
>
{{ entry.name }}
<div v-for="entry in entrys" :key="entry.url" @click="routeTo(entry.url)">
{{ entry.inputName }}
</div>
</div>
</m-card>
......@@ -25,15 +21,14 @@ export default defineComponent({
},
},
setup() {
const entrys = computed(() => store.state.communityOptions)
const entrys = computed(() => store.state.entry)
const router = useRouter()
const routeTo = (id: string) => {
router.push({
name: 'community',
query: {
id,
},
})
const routeTo = (url: string) => {
if (url.includes('http')) {
window.open(url, '_blank')
} else {
router.push(url)
}
}
return {
entrys,
......
......@@ -62,6 +62,7 @@ export default defineComponent({
rate: +Math.ceil((item.num / total) * 100).toFixed(0),
value: item.num,
}))
// return [c, a, b]
})
const placeList = computed(() => {
......
......@@ -87,13 +87,6 @@ export default defineComponent({
communityNum = 0,
} = rank.value
return [
{
name: '街面管理',
value: streetDispatchNum,
percent: streetNum
? Math.floor((streetDispatchNum / streetNum) * 100)
: 0,
},
{
name: '综合管理',
value: communityNum,
......@@ -101,6 +94,13 @@ export default defineComponent({
? Math.floor(comprehensiveDispatchNum / comprehensiveNum) * 100
: 0,
},
{
name: '街面管理',
value: streetDispatchNum,
percent: streetNum
? Math.floor((streetDispatchNum / streetNum) * 100)
: 0,
},
{
name: '小区管理',
value: communityDispatchNum,
......@@ -111,27 +111,9 @@ export default defineComponent({
]
})
const classChartData = ref({
dimensions: [
{ name: 'class1', displayName: '分类1', max: 100 },
{ name: 'class2', displayName: '分类2', max: 100 },
{ name: 'class3', displayName: '分类3', max: 100 },
],
source: [
{
seriesName: '分类排行',
class1: 0,
class2: 0,
class3: 0,
},
],
})
// 监听年份切花更改检查楼数 隐患点数 危险点数
watch(
() => classificationRank.value,
(data) => {
if (!data || data.length === 0) return
const classChartData = computed(() => {
const data = classificationRank.value
if (!data || data.length === 0) return { dimensions: null, source: null }
const source: any = [
{
seriesName: '分类排行',
......@@ -140,7 +122,7 @@ export default defineComponent({
class3: 0,
},
]
const dimensions = data.map((item, index) => {
const [a, b, c] = data.map((item, index) => {
const name = `class${index + 1}`
source[0][name] = item.num
return {
......@@ -149,29 +131,47 @@ export default defineComponent({
max: 150,
}
})
classChartData.value = {
const dimensions = [c, a, b]
return {
dimensions,
source,
}
},
{ immediate: true }
)
})
const responseChartData = ref({
dimensions: [
// const responseChartData = ref({
// dimensions: [
// { name: 'name', displayName: '坐标名' },
// { name: 'data1', displayName: '今日新增及存量' },
// { name: 'data2', displayName: '今日派单处置' },
// ],
// source: [
// { name: '09-10', data1: 100, data2: 10 },
// { name: '20-11', data1: 110, data2: 20 },
// { name: '11-12', data1: 120, data2: 30 },
// { name: '12-13', data1: 130, data2: 40 },
// { name: '13-14', data1: 140, data2: 50 },
// { name: '14-15', data1: 150, data2: 60 },
// { name: '15-16', data1: 150, data2: 100 },
// ],
// })
const responseChartData = computed(() => {
const data = store.state.responsivity
const dimensions = [
{ name: 'name', displayName: '坐标名' },
{ name: 'data1', displayName: '今日新增及存量' },
{ name: 'data2', displayName: '今日派单处置' },
],
source: [
{ name: '09-10', data1: 100, data2: 10 },
{ name: '20-11', data1: 110, data2: 20 },
{ name: '11-12', data1: 120, data2: 30 },
{ name: '12-13', data1: 130, data2: 40 },
{ name: '13-14', data1: 140, data2: 50 },
{ name: '14-15', data1: 150, data2: 60 },
{ name: '15-16', data1: 150, data2: 100 },
],
{ name: 'data1', displayName: '总数' },
{ name: 'data2', displayName: '派遣数' },
]
if (!data || data.length === 0) return { dimensions, source: [] }
const source = data.reverse().map((item: any) => {
const date = item.date && item.date.split('-')
const { totalNum = 0, reachNum = 0 } = item.statistical || {}
return {
name: `${date[1]}-${date[2]}`,
data1: totalNum,
data2: reachNum,
}
})
return { dimensions, source }
})
const chartOption = ref<ChartTypes.ECOption>({
color: ['#6BE1B2', '#FFCE34'],
......@@ -180,6 +180,11 @@ export default defineComponent({
itemWidth: fontSize.value,
itemHeight: fontSize.value * 0.8,
},
xAxis: {
axisLabel: {
interval: 0,
},
},
})
const chartOption2 = ref({
......@@ -240,17 +245,18 @@ export default defineComponent({
&.wrapper
display flex
>div
width 50%
width 46%
height 100%
&:first-child
$center()
flex-direction column
font-size .12rem
p
width 60%
width 50%
margin 0 auto
.count
font-family $font-barlow
font-size .12rem
font-size .16rem
margin-left .1rem
.emergency
height 1.22rem
......
......@@ -33,7 +33,13 @@
</div>
</div>
<div class="case-follow">
<m-sub2>事件跟踪</m-sub2>
<m-sub2
search-able
@search="searchKey = $event"
@close="searchKey = null"
>
跟踪
</m-sub2>
<m-empty
v-if="!trackEvent || trackEvent.length === 0"
style="height: 1.8rem"
......@@ -75,7 +81,14 @@ export default defineComponent({
const stageCase = computed(() => store.state.stageCase)
const workstationKind = computed(() => store.state.workstationKind)
const pieDatamodel = computed(() => store.state.workstationKindPiEData)
const trackEvent = computed(() => store.state.trackEvent)
const searchKey = ref('')
const trackEvent = computed(() => {
const data = store.state.trackEvent
return searchKey.value
? data.filter((item: any) => item.address.includes(searchKey.value))
: data
})
const fontSize = computed(() => Math.floor((screen.height * 1.6) / 100))
const showChart = computed(() => store.state.curTheme === 'manage')
......@@ -230,9 +243,6 @@ export default defineComponent({
]
})
const steps = ref(['发现', '立案', '派遣', '处置', '核查', '结案'])
const searchCase = (key: string) => {
console.log('searck key: ', key)
}
return {
summary,
......@@ -242,9 +252,8 @@ export default defineComponent({
barOption,
pieData,
steps,
// caseList,
searchCase,
todayCase,
searchKey,
trackEvent,
workstationKind,
}
......
<template>
<m-card title="生态">
<div class="detail">
<div v-for="item in ecologyList" :key="item.labelName">
<div
v-for="item in ecologyList"
:key="item.labelName"
@click="getPoints(item.labelName)"
>
<m-count class="count orange-count" :value="item.num" />
<p>{{ item.labelName }}</p>
</div>
......@@ -134,12 +138,14 @@ export default defineComponent({
const photos2 = computed(() =>
photosList.value.filter((e) => e.buildingType.includes('文保'))
)
const getPoints = (name: string) => store.dispatch('getEcologyPoints', name)
return {
ecologyList,
sumList,
businessPhotos,
photos1,
photos2,
getPoints,
}
},
})
......@@ -155,6 +161,10 @@ export default defineComponent({
>div
$center()
width 25%
cursor pointer
&:hover
color #FF8635
font-weight bold
.count
font-size .14rem
font-family $font-barlow
......@@ -165,7 +175,7 @@ export default defineComponent({
>div
display flex
align-items center
width 33.3%
width 25%
margin .02rem 0
img
width .26rem
......
......@@ -71,10 +71,8 @@
</m-card>
<m-modal
v-model="listModal"
enter="fadeInRight"
leave="fadeOutRight"
offset="65%"
width="40%"
offset="60%"
title="重点关注楼宇清单"
:mask-closable="false"
>
......
......@@ -45,7 +45,7 @@
offset="-50%"
enter="fadeInUp"
leave="fadeOutDown"
translate-y="84%"
translate-y="100%"
:mask-closable="false"
:title="`${streetData.cmtName}2021年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