Commit 5566bd5b authored by 郭铭瑶's avatar 郭铭瑶 🤘

对接接口

parent 9a74ec80
......@@ -21,6 +21,8 @@ export default {
BASE_URL,
SOURCE_URL,
TEST: '/service-basicdatasync-ddd/communities',
GET_LIST: '/service-special-nandong/classifyAddrs', // 根据地址搜索
GET_ROOM: '/service-special-nandong/households', // 获取分户
GET_COMMUNITY_DETAIL: '/service-basicdatasync-ddd/communities',
GET_BUILDING: '/service-basicdatasync-ddd/building', // 门牌幢列表
GET_INDUSTRY_AUTHORITY: '/service-basicdatasync-ddd/indCous', // 业委会列表
......
src/assets/images/dot2.png

1.15 KB | W: | H:

src/assets/images/dot2.png

458 Bytes | W: | H:

src/assets/images/dot2.png
src/assets/images/dot2.png
src/assets/images/dot2.png
src/assets/images/dot2.png
  • 2-up
  • Swipe
  • Onion skin
......@@ -85,6 +85,8 @@ export default defineComponent({
border .01rem dotted rgba(47,134,238, .6)
margin .06rem
padding .06rem
// width 100%
height 99%
.dot
position absolute
width .1rem
......
<template>
<div class="my-empty">
<img src="@/assets/images/no-data.png" />
<p>{{ text }}</p>
<img :src="img" />
<p v-if="!hiddenText">{{ text }}</p>
</div>
</template>
<script lang="ts">
import { defineComponent, PropType } from 'vue'
import img from '@/assets/images/no-data.png'
export default defineComponent({
name: 'MyEmpty',
......@@ -17,6 +18,14 @@ export default defineComponent({
type: String as PropType<string>,
default: '暂无数据',
},
img: {
type: String as PropType<string>,
default: () => img,
},
hiddenText: {
type: Boolean as PropType<boolean>,
default: false,
},
},
})
</script>
......
<template>
<div class="my-form">
<div class="my-form" :class="{ stripe: stripe }">
<div v-for="(row, rowIndex) in template" :key="rowIndex" class="row">
<div
v-for="(col, colIndex) in row.split('|')"
......@@ -63,6 +63,10 @@ export default defineComponent({
type: String as PropType<string>,
default: '1rem',
},
stripe: {
type: Boolean as PropType<boolean>,
default: false,
},
},
setup(props) {
const calcWidth = (key: string): number => {
......@@ -134,12 +138,20 @@ export default defineComponent({
@import '../main.styl'
.my-form
$full()
&.stripe
.row
background $table-content-bg
box-shadow none
margin-top 0
border-radius 0
&:nth-child(odd)
background transparent
.row
display flex
background $table-content-bg
padding .03rem 0
&:nth-child(odd)
background transparent
background rgba(70,83,97,.45)
box-shadow 0 0 .04rem 0 rgba(44,51,70,.65)
margin-top .04rem
border-radius .04rem
.col
display flex
align-items center
......
......@@ -11,7 +11,7 @@
</p>
</div>
</div>
<div class="table-content">
<div v-if="data && data.length > 0" class="table-content">
<div
v-for="(item, index) in data"
:key="index"
......@@ -35,6 +35,7 @@
</div>
</div>
</div>
<MyEmpty v-else />
<MyModal v-model="showImgModal" title="照片预览">
<img v-if="showImgModal && imgSrc" style="width: 100%" :src="imgSrc" />
</MyModal>
......@@ -44,6 +45,7 @@
<script lang="ts">
import { computed, defineComponent, PropType, ref } from 'vue'
import MyModal from '../MyModal/my-modal.vue'
import MyEmpty from '../MyEmpty/my-empty.vue'
interface FormatterType {
[propName: string]: <T>(val: T) => T
......@@ -55,7 +57,7 @@ interface DataType {
export default defineComponent({
name: 'MyTable',
displayName: 'm-table',
components: { MyModal },
components: { MyModal, MyEmpty },
props: {
/** 布局模板 */
template: {
......
import { App } from 'vue'
import animate from 'animate.css'
import MyMap from './MyMap/my-map.vue'
import MyTitle from './MyTitle/my-title.vue'
import MyLoader from './MyLoader/my-loader.vue'
......@@ -25,6 +24,7 @@ import MyProgress from './MyProgress/my-progress.vue'
import MyDrawer from './MyDrawer/my-drawer.vue'
import * as ChartTypes from './MyChart/types'
// import { withInstall } from './util'
import 'animate.css'
import 'normalize.css'
const components = [
......@@ -54,7 +54,6 @@ const components = [
]
const install = (app: App): App => {
app.use(animate)
// components.forEach((component) => app.use(withInstall(component)))
components.forEach((component) =>
app.component(component.displayName, component)
......
......@@ -8,6 +8,7 @@ export default {
initData({ dispatch }: { dispatch: Dispatch }): void {
dispatch('getPropertySummary')
dispatch('getCaseList')
dispatch('getRoomList')
dispatch('GET_PUBLICSAFE_COMMANDSYSTEM')
dispatch('GET_PUBLICSAFE_STREETPOWER')
dispatch('GET_PUBLICSAFE_PARTY')
......@@ -80,6 +81,18 @@ export default {
).data
commit('SET_CASE_LIST', content)
},
async getRoomList(
{ commit }: { commit: Commit },
address = null
): Promise<void> {
const { content } = (
await ajax.get({
url: api.GET_LIST,
params: { pageSize: 200, addr_l: address, classifyName: '分户' },
})
).data
commit('SET_ROOM_LIST', content)
},
// 公共服务 - 门岗值守 - 社会物业和直管公房数据
async GET_PUBLICSAFE_NEWFIND({ commit }: { commit: Commit }): Promise<void> {
......
......@@ -110,6 +110,7 @@ export interface GlobalStateProps {
curTheme: ThemeType
propertySummary: { [key: string]: number }
caseList: unknown[]
roomList: unknown[]
pubulicSafeGateSenteryShehuiwuye: { [key: string]: number }[]
pubulicSafeGateSenteryZhiguangongfang: { [key: string]: number }[]
pubulicSafeMap: unknown[]
......
......@@ -41,6 +41,9 @@ export default {
SET_CASE_LIST(state: GlobalStateProps, data: unknown[]): void {
state.caseList = data
},
SET_ROOM_LIST(state: GlobalStateProps, data: unknown[]): void {
state.roomList = data
},
SET_STATION(state: GlobalStateProps, data: { [key: string]: unknown }): void {
state.stationInfo = data
},
......
......@@ -181,6 +181,7 @@ export default {
},
propertySummary: {},
caseList: [],
roomList: [],
stationInfo: {},
pubulicSafeGateSenteryShehuiwuye: [],
pubulicSafeGateSenteryZhiguangongfang: [],
......
......@@ -29,7 +29,7 @@
<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-option value="community">小区</a-select-option>
</a-select>
<a-input
v-model:value="searchKey"
......@@ -42,10 +42,10 @@
<div class="modal-case-content">
<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 :class="getStyle(item.managementType || item.classifyName)">{{
item.managementType || item.classifyName
}}</span>
<p>{{ item.address }}</p>
<p>{{ item.address || item.addr }}</p>
</div>
</template>
<m-empty v-else />
......@@ -58,6 +58,22 @@
:case-info="caseInfo"
/>
</m-drawer>
<m-drawer v-model="populationModal">
<PopulationDrawer
:community-info="communityInfo"
:property-info="propertyInfo"
:case-info="caseInfo"
:building-info="buildingInfo"
:room-info="roomInfo"
/>
</m-drawer>
<m-drawer v-model="communityModal">
<CommunityDrawer
:community-info="communityInfo"
:property-info="propertyInfo"
:case-info="caseInfo"
/>
</m-drawer>
</template>
<script lang="ts">
......@@ -74,12 +90,14 @@ 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 PopulationDrawer from '@/view/drawers/population-drawer.vue'
import CommunityDrawer from '@/view/drawers/community-drawer.vue'
import store from '@/store'
import { ajax, api } from '@/ajax'
export default defineComponent({
name: 'MapBtns',
components: { CaseDrawer },
components: { CaseDrawer, PopulationDrawer, CommunityDrawer },
emits: ['full', 'change', 'zoom'],
setup(_, ctx) {
const curViewType = computed(() => store.state.curView.type)
......@@ -121,10 +139,10 @@ export default defineComponent({
ctx.emit('full', fullScreen.value)
break
case 'search':
store.dispatch('getCaseList')
searchModal.value = true
searchKey.value = ''
searchType.value = 'case'
store.dispatch('getCaseList')
break
case 'in':
case 'out':
......@@ -140,7 +158,11 @@ export default defineComponent({
break
}
}
const caseList = computed(() => store.state.caseList)
const caseList = computed(() =>
searchType.value === 'population'
? store.state.roomList
: store.state.caseList
)
const options = computed(() => {
if (curViewType.value === 'street') {
return [
......@@ -165,7 +187,11 @@ export default defineComponent({
const handleSearch = () => {
const address = searchKey.value
store.dispatch('getCaseList', address)
if (searchType.value === 'population') {
store.dispatch('getRoomList', address)
} else {
store.dispatch('getCaseList', address)
}
}
const getStyle = (type: string): string => {
switch (type) {
......@@ -176,19 +202,20 @@ export default defineComponent({
case '综合':
return 'blue'
default:
return ''
return 'blue'
}
}
const caseModal = ref(false)
const communityInfo = ref(null)
const propertyInfo = ref(null)
const caseInfo = ref(null)
const populationModal = ref(false)
const communityModal = ref(false)
const communityInfo = ref<any>(null)
const propertyInfo = ref<any>(null)
const caseInfo = ref<any>(null)
const roomInfo = ref<any>(null)
const buildingInfo = ref<any>(null)
const handleSelect = async (item: any) => {
const { content } = (
await ajax.get({ url: `${api.GET_CASE_DETAIL}/${item.id}` })
).data
propertyInfo.value = content
caseInfo.value = item
if (item.communityId) {
const { content } = (
await ajax.get({
......@@ -197,8 +224,72 @@ export default defineComponent({
})
).data
communityInfo.value = content && content[0]
const cspId = content && content[0] && content[0].cspId
if (cspId) {
const { content } = (
await ajax.get({ url: api.GET_COMPANY, params: { cspId } })
).data
propertyInfo.value = content && content[0]
}
} else {
communityInfo.value = {}
propertyInfo.value = {}
}
if (searchType.value === 'case') {
caseModal.value = true
populationModal.value = false
communityModal.value = false
} else {
const { content } = (
await ajax.get({
url: api.GET_CASE,
params: { pageSize: 200, address_l: item.address || item.addr },
})
).data
caseInfo.value = content || []
if (searchType.value === 'population') {
if (item.addr) {
const { content } = (
await ajax.get({ url: api.GET_ROOM, params: { addr: item.addr } })
).data
roomInfo.value = content && content[0]
const buildingId = content && content[0] && content[0].buildingId
if (buildingId) {
const { content } = (
await ajax.get({
url: api.GET_BUILDING,
params: { unitId: buildingId },
})
).data
buildingInfo.value = content && content[0]
const sectId = content && content[0] && content[0].sectId
if (sectId) {
const { content } = (
await ajax.get({
url: api.GET_COMMUNITY_DETAIL,
params: { sectId },
})
).data
communityInfo.value = content && content[0]
} else {
communityInfo.value = null
}
} else {
buildingInfo.value = null
}
} else {
roomInfo.value = null
}
populationModal.value = true
caseModal.value = false
communityModal.value = false
} else if (searchType.value === 'community') {
communityModal.value = true
populationModal.value = false
caseModal.value = false
}
}
caseModal.value = true
}
return {
......@@ -217,9 +308,13 @@ export default defineComponent({
getStyle,
handleSelect,
caseModal,
populationModal,
communityModal,
communityInfo,
propertyInfo,
caseInfo,
buildingInfo,
roomInfo,
}
},
})
......
......@@ -6,10 +6,11 @@
:class="{ on: curTabKey === tab.key }"
@click.prevent="handleSelect(tab.key)"
>
<img :src="horizontal ? img2 : img1" />
<!-- <img :src="horizontal ? img2 : img1" /> -->
<p>{{ tab.name }}</p>
<img :src="horizontal ? img2 : img1" />
<!-- <img :src="horizontal ? img2 : img1" /> -->
</div>
<span v-if="horizontal" class="dot"></span>
</div>
</template>
......@@ -62,23 +63,41 @@ export default defineComponent({
height 100%
display flex
flex-direction column
align-items center
border-right .01rem solid $primary-border
position relative
>.dot
display inline-block
width 0
height @width
border .05rem solid transparent
border-right-color #FFB560
position absolute
right 0
&.horizontal
width 100%
height .25rem
flex-direction row
border-right none
border-bottom .01rem solid $primary-border
border-bottom .01rem solid rgba(255,255,255,.2)
>div
flex-direction row
align-items center
max-width .8rem
max-width .6rem
color $edge
font-size .09rem
opacity 0.6
transition all .2s ease
&.on
&:hover
background url('@/assets/images/tab-on2.png') 100% / 100% 100% no-repeat
img
height 100%
width auto
color #fff
font-size .11rem
opacity 1
font-weight bold
// background url('@/assets/images/tab-on2.png') 100% / 100% 100% no-repeat
// img
// height 100%
// width auto
p
min-height 0
// min-width .5rem
......@@ -92,15 +111,23 @@ export default defineComponent({
cursor pointer
color #acacac
font-weight bold
color $edge
font-size .09rem
opacity 0.6
transition all .2s ease
&.on
&:hover
color #fff
background url('@/assets/images/tab-on.png') 100% / 100% 100% no-repeat
img
width .25rem
height .1rem
&:last-child
transform rotate(180deg)
font-size .11rem
opacity 1
font-weight bold
// color #fff
// background url('@/assets/images/tab-on.png') 100% / 100% 100% no-repeat
// img
// width .25rem
// height .1rem
// &:last-child
// transform rotate(180deg)
p
display flex
align-items center
......
......@@ -31,14 +31,19 @@
'bizLicenseValidDate:营业执照有效期',
'bizLicenseCode:营业执照号',
]"
:data="propertyData"
:data="propertyInfo"
label-width="1.4rem"
/>
</m-card>
<m-card title="案件详情">
<div class="sum">
<p>黄浦区重庆北路216弄2~66号重新校区15号605室</p>
<span>案件分类</span> <span>综合</span>
<p>{{ caseInfo.address }}</p>
<span v-show="caseInfo.managementScoreType">
<b>{{ caseInfo.managementScoreType }}</b>
</span>
<span v-show="caseInfo.managementType">
<b>{{ caseInfo.managementType }}</b>
</span>
</div>
<div v-for="item in details" :key="item.title" class="step">
<p class="title">
......@@ -46,7 +51,7 @@
</p>
<div class="content">
<p class="sub">{{ item.sub }}</p>
<p>{{ item.content }}</p>
<p>{{ item.content || '无' }}</p>
<template v-if="item.imgs">
<img v-for="(img, i) in item.imgs" :key="i" :src="img" />
</template>
......@@ -57,31 +62,35 @@
</template>
<script lang="ts">
import { computed, defineComponent, PropType, ref } from 'vue'
import { computed, defineComponent, PropType } 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'
export default defineComponent({
name: 'CaseDrawer',
components: { SubTitle },
props: {
communityInfo: {
type: Object as PropType<{ [key: string]: any }>,
required: true,
type: Object as PropType<{ [key: string]: any } | null>,
default: () => {
return {}
},
},
propertyInfo: {
type: Object as PropType<{ [key: string]: any }>,
required: true,
type: Object as PropType<{ [key: string]: any } | null>,
default: () => {
return {}
},
},
caseInfo: {
type: Object as PropType<{ [key: string]: any }>,
required: true,
type: Object as PropType<{ [key: string]: any } | null>,
default: () => {
return {}
},
},
},
setup(props) {
const communityData = computed(() => {
const { communityInfo, propertyInfo } = props
const { communityInfo = {}, caseInfo = {} } = props
const keys = [
{ name: '北', key: 'stCspNorth' },
{ name: '南', key: 'stCspSouth' },
......@@ -91,63 +100,58 @@ export default defineComponent({
const range = keys.map((item) =>
communityInfo && communityInfo[item.key]
? item.name + communityInfo[item.key]
: ''
: null
)
return {
...communityInfo,
address: propertyInfo.address,
range: range.join(','),
address: caseInfo && caseInfo.address,
range: range.filter((e) => e !== null).join(','),
}
})
const propertyData = computed(() => {
console.log(props.propertyInfo)
return props.propertyInfo
})
const formData = ref({
name: '测试文字',
address: '测试文字',
belong: '测试文字',
buildingNum: '测试文字',
roomNum: '测试文字',
buidlingArea: '测试文字',
area: '测试文字',
rang: '测试文字',
excludeRang: '测试文字',
const details = computed(() => {
const { caseInfo } = props
if (!caseInfo) return []
return [
{
title: `${caseInfo.phase} · ${caseInfo.reportPersonnel}`,
sub: caseInfo.acceptTime,
content: caseInfo.reportContent,
imgs: [],
},
]
})
const details = ref([
{
title: '发现 · 举报人',
sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
content:
'案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
imgs: [detail1, detail2],
},
{
title: '立案 · 举报人',
sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
content:
'内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
imgs: [detail1, detail2],
},
{
title: '派遣 · 举报人',
sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
content:
'内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
},
{
title: '处置 · 举报人',
sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
content:
'内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
imgs: [detail1, detail2],
},
])
// const details = ref([
// {
// title: '发现 · 举报人',
// sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
// content:
// '案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
// imgs: [detail1, detail2],
// },
// {
// title: '立案 · 举报人',
// sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
// content:
// '内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
// imgs: [detail1, detail2],
// },
// {
// title: '派遣 · 举报人',
// sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
// content:
// '内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
// },
// {
// title: '处置 · 举报人',
// sub: '2020-12-31 16:34 | xxx区xxx路xxx弄xxx号',
// content:
// '内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述案件内容描述',
// imgs: [detail1, detail2],
// },
// ])
return {
communityData,
propertyData,
formData,
details,
}
},
......@@ -161,39 +165,55 @@ export default defineComponent({
display flex
justify-content space-between
>div
width 35%
width 40%
&:last-child
width 64%
width 59%
.sum
border-bottom .01rem solid $primary-border
border-bottom .01rem dotted $primary-border
padding-bottom .1rem
background rgba(70,83,97,.45)
box-shadow 0 0 .04rem 0 rgba(44,51,70,.65)
padding .05rem .1rem
span
display inline-block
font-size .08rem
padding 0 .03rem
border .01rem solid orange
border-radius .02rem
margin-right .03rem
color orange
padding 0 .1rem
border-radius .08rem
margin-right .1rem
transform skew(-30deg)
background linear-gradient(to right, #FFF764, #BBA619)
>b
display inline-block
transform skew(30deg)
font-weight normal
color #000
&:last-child
color gold
border-color gold
background linear-gradient(to right, #64DCFF, #02B2D2)
.step
margin-top .05rem
background rgba(70,83,97,.45)
box-shadow 0 0 .04rem 0 rgba(44,51,70,.65)
padding .05rem .1rem
p
&.title
font-size .12rem
font-size .14rem
display flex
align-items center
color $secondary-color
font-weight bold
background-clip text
-webkit-background-clip text
-webkit-text-fill-color transparent
background-image linear-gradient(to right, #FF521E, gold)
>img
width .14rem
margin-right .05rem
margin-right .08rem
transform translateX(10%)
&.sub
color #aaa
color #ccc
font-size .09rem
border-bottom .01rem solid $primary-border
border-bottom .01rem solid rgba(255,255,255,0.1)
margin .04rem 0
padding .04rem 0
.content
padding-left .15rem
border-left .01rem solid $secondary-color
......
<template>
<div class="community-drawer">
<m-card title="相关案件">
<div class="case-wrap">
<div
v-for="(item, i) in caseInfo"
:key="i"
class="case-item"
:class="{ done: item && item.phase === '结案' }"
>
<div>
<p>
{{ item.address }}
<span v-show="item.managementScoreType">
<b>{{ item.managementScoreType }}</b>
</span>
<span v-show="item.managementType">
<b>{{ item.managementType }}</b>
</span>
</p>
<p>{{ item.acceptTime }}</p>
</div>
<div>{{ item.reportContent || '无' }}</div>
<div v-if="item && item.phase === '结案'" class="flag">已结案</div>
<div v-else class="flag">处置中</div>
</div>
</div>
</m-card>
<m-card title="房屋档案">
<m-form
:template="[
'stNameFrst:小区名称',
'address:小区地址|cmtName:所属居委会',
'totUnits:总门牌幢数|totHous:总户数',
'stCnstArea:总建筑面积|landArea:占地面积',
'range:小区四至范围',
'stNotcsparea:四至范围不包括',
]"
:data="communityData"
label-width="1.2rem"
/>
<Tabs class="tabs" :list="tabs" horizontal />
</m-card>
</div>
</template>
<script lang="ts">
import { defineComponent, ref, PropType, computed } from 'vue'
import Tabs, { TabsProp } from '../components/tabs.vue'
import SubTitle from '../components/sub-title.vue'
export default defineComponent({
name: 'CommunityDrawer',
components: { Tabs, SubTitle },
props: {
communityInfo: {
type: Object as PropType<{ [key: string]: any } | null>,
default: () => {
return {}
},
},
propertyInfo: {
type: Object as PropType<{ [key: string]: any } | null>,
default: () => {
return {}
},
},
caseInfo: {
type: Array as PropType<any[] | null>,
default: () => {
return []
},
},
},
setup(props) {
const curTab = ref('room')
const tabs = ref<TabsProp[]>([
{
key: 'room',
name: '门牌户室',
},
{
key: 'property',
name: '物业信息',
},
{
key: 'committee',
name: '业委会',
},
{
key: 'device',
name: '设施设备',
},
{
key: 'public',
name: '公共设施',
},
])
const data1 = ref({
community: '测试文字',
building: '测试文字',
communityType: '测试文字',
roomNo: '测试文字',
company: '测试文字',
manager: '测试文字',
manageOffice: '测试文字',
hasElev: '测试文字',
yewei: '测试文字',
juwei: '测试文字',
})
const houseData = computed(() => {
const { communityInfo, propertyInfo, caseInfo } = props
console.log(communityInfo, propertyInfo, caseInfo)
return { ...communityInfo, ...propertyInfo }
})
const data2 = ref({
name: '暂无',
phone: '暂无',
household: '暂无',
})
const communityData = computed(() => {
const { communityInfo = {}, caseInfo = [] } = 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]
: null
)
return {
...communityInfo,
address: caseInfo && caseInfo[0] && caseInfo[0].address,
range: range.filter((e) => e !== null).join(','),
}
})
const showPersonDetail = ref(false)
const selectPerson = (person: any) => {
console.log('select-person', person)
showPersonDetail.value = true
}
return {
curTab,
tabs,
houseData,
data1,
data2,
communityData,
selectPerson,
showPersonDetail,
}
},
})
</script>
<style lang="stylus" scoped>
@import '../../components/MyComponent/main.styl'
$border = .01rem solid rgba(91,213,255,.3)
.community-drawer
display flex
justify-content space-between
>div
width 35%
&:last-child
width 64%
.case-wrap
max-height 85vh
overflow-y auto
.case-item
position relative
margin-top .08rem
padding .05rem .08rem
overflow hidden
background rgba(70,83,97,.45)
box-shadow 0 0 .04rem 0 rgba(44,51,70,.65)
border-radius .04rem
&.done
.flag
background #27C5A2
>div
&:nth-of-type(1)
border-bottom $border
padding-bottom .05rem
margin-bottom .05rem
p
&:last-child
font-size .09rem
color #ccc
margin .04rem 0
span
display inline-block
font-size .08rem
padding 0 .1rem
border-radius .08rem
margin-left .1rem
transform skew(-30deg)
background linear-gradient(to right, #FFF764, #BBA619)
>b
display inline-block
transform skew(30deg)
font-weight normal
color #000
&:last-child
background linear-gradient(to right, #64DCFF, #02B2D2)
.flag
background $secondary-color
position absolute
top -0.16rem
right -0.36rem
transform rotate(45deg)
height .4rem
width .8rem
display flex
color #000
align-items flex-end
justify-content center
font-size .09rem
.person-bar
display flex
justify-content space-between
.back-btn
padding 0 .06rem
background $primary-color
cursor pointer
border-radius .02rem
&:hover
background $secondary-color
</style>
This diff is collapsed.
......@@ -57,12 +57,16 @@ export default defineComponent({
const rankList = computed(() => {
const data = store.state.analysisRank[curOption.value] || []
const total = data.reduce((acc, cur) => acc + cur.num, 0)
return data.map((item: any) => ({
const result = data.map((item: any) => ({
name: item.managementType,
rate: +Math.ceil((item.num / total) * 100).toFixed(0),
value: item.num,
}))
// return [c, a, b]
if (result.length > 0) {
const [a, b, c] = result
return [c, a, b]
}
return []
})
const placeList = computed(() => {
......
......@@ -125,13 +125,18 @@ export default defineComponent({
const rankList = computed(() => {
const data = store.state.dutyRanking[curOption.value] || []
const total = data.reduce((acc, cur) => acc + cur.num, 0)
return data.map((item: any) => ({
const result = data.map((item: any) => ({
name: item.managementType,
rate: +Math.ceil((item.num / total) * 100).toFixed(0),
value: item.num,
unit: '件',
color: '#fff',
}))
if (result.length > 0) {
const [a, b, c] = result
return [b, a, c]
}
return []
})
const placeList = computed(() => {
const data = store.state.dutyPlaces[curOption.value] || []
......
......@@ -83,7 +83,7 @@
'projectName|houseAddr|inspectionDate|useType|buildYear|planeSituation|constructArea|structureType|floor|outerWallFacilityHiddenPoint|outerWallFacilityDangerPoint',
]"
:data="buildings"
></m-table>
/>
</div>
</m-modal>
</template>
......
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