Skip to content

H
huamu
Commit f1dd58a0 authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

基本情况接口对接

parent 32ae49ba
Hide whitespace changes
Inline Side-by-side
Showing with 353 additions and 63 deletions
src/ajax/api.ts
View file @ f1dd58a0
......@@ -18,8 +18,8 @@ switch (process.env.NODE_ENV) {
)
break
default:
BASE_URL = 'https://survey.idatatlas.com/public/api/data/'
TOKEN = '9f6ac66f-18bb-4f0c-930d-c8afa50d29ce'
BASE_URL = '/api'
TOKEN = '91e315a9-b2a8-4950-97fa-9dbf84a230d6'
}
export default {
......@@ -32,5 +32,6 @@ export default {
COMMITTEE: '6f610aca-39c2-4401-8b75-12f94193d956',
COMMUNITY: '931687e6-b53a-4f2d-8ab9-83b4a7d5ea8f',
STREET: 'af3ce0b6-f32d-4914-a336-bb7f6398ff85',
BUIDING: 'e08e40c6-a15c-447d-8f9e-786216d93443',
BUILDING: 'e08e40c6-a15c-447d-8f9e-786216d93443',
ATTACHMENT: '988fc63e-fa55-4729-851d-24c4355213f2',
}
src/ajax/axios.ts
View file @ f1dd58a0
......@@ -24,7 +24,7 @@ Axios.interceptors.response.use(
store.commit('SET_LOADING', false)
}
// TODO 返回的数据status判断错误操作等……
return response.data
return response
},
(error) => {
store.commit('SET_LOADING', false)
......
src/components/MyComponent/MyLoader/my-loader.vue
View file @ f1dd58a0
......@@ -39,8 +39,8 @@ export default defineComponent({
.middle,
.inner
border .03rem solid transparent
border-top-color #47B3FF
border-right-color @border-top-color
border-top-color $red
border-right-color $red
border-radius 50%
position absolute
top 50%
......@@ -58,11 +58,9 @@ export default defineComponent({
width .08rem
height @width
animation spin 1.5s linear infinite
@keyframes spin {
to {
@keyframes spin
to
transform translate(-50%, -50%) rotate(360deg)
border-top-color #00f2ff
border-right-color @border-top-color
}
}
border-top-color $pink
border-right-color $pink
</style>
src/hooks/useFetch.ts 0 → 100644
View file @ f1dd58a0
import { ajax, api } from '@/ajax'
interface QueryProps {
a?: string
q?: string
keys?: string
[key: string]: unknown
}
export async function useFetchOrg(params: QueryProps) {
const res = await ajax.get({
url: api.ORGANIZATION,
params,
})
return res && res.data && res.data.result
}
export async function useFetchMember(params: QueryProps) {
const res = await ajax.get({
url: api.MEMBER,
params,
})
return res && res.data && res.data.result
}
export async function useFetchActivity(params: QueryProps) {
const res = await ajax.get({
url: api.ACTIVITY,
params,
})
return res && res.data && res.data.result
}
export async function useFetchArea(params: QueryProps) {
const res = await ajax.get({
url: api.AREA,
params,
})
return res && res.data && res.data.result
}
export async function useFetchCommittee(params: QueryProps) {
const res = await ajax.get({
url: api.COMMITTEE,
params,
})
return res && res.data && res.data.result
}
export async function useFetchCommunity(params: QueryProps) {
const res = await ajax.get({
url: api.COMMUNITY,
params,
})
return res && res.data && res.data.result
}
export async function useFetchStreet(params: QueryProps) {
const res = await ajax.get({
url: api.STREET,
params,
})
return res && res.data && res.data.result
}
export async function useFetchBuilding(params: QueryProps) {
const res = await ajax.get({
url: api.BUILDING,
params,
})
return res && res.data && res.data.result
}
export async function useFetchAttachment(params: QueryProps) {
const res = await ajax.get({
url: api.ATTACHMENT,
params,
})
return res && res.data && res.data.result
}
src/main.ts
View file @ f1dd58a0
......@@ -37,6 +37,7 @@ import {
NLayoutHeader,
NLayoutContent,
NMenu,
NPopover,
} from 'naive-ui'
import { normalizeHue } from 'naive-ui/lib/color-picker/src/utils'
......@@ -73,6 +74,7 @@ const naive = create({
NMenu,
NLayoutHeader,
NLayoutContent,
NPopover,
],
})
......
src/util/dayjs.ts 0 → 100644
View file @ f1dd58a0
import dayjs from 'dayjs'
import ch from 'dayjs/locale/zh-cn'
import LocalizedFormat from 'dayjs/plugin/LocalizedFormat'
dayjs.extend(LocalizedFormat)
dayjs.locale(ch)
export default dayjs
src/util/menus.ts 0 → 100644
View file @ f1dd58a0
export default [
{
key: 'system',
name: '系统',
children: [
{
name: '管市民',
list: [
{
name: '市民（房屋）信息系统',
id: 'page_40bf6060-cccc-11ea-a34f-f558bf9fe429',
},
{ name: '志愿者信息系统' },
{ name: '党员团员信息系统' },
{ name: '重点关怀对象信息系统' },
{ name: '统战人员信息系统' },
{ name: '司法管理人员信息系统' },
{ name: '自治组织信息系统' },
{ name: '更多系统' },
],
},
{
name: '管商办',
list: [
{
name: '楼宇信息系统',
id: 'page_50bb42f0-3544-11eb-813d-85e48fa0f61d',
},
{
name: '企业信息系统',
id: 'page_50bb42f0-3544-11eb-813d-85e48fa0f61d',
},
{
name: '商铺信息系统',
id: 'page_50bb42f0-3544-11eb-813d-85e48fa0f61d',
},
{ name: '更多系统' },
],
},
{
name: '管自己',
list: [
{
name: '视频信息系统',
id: 'page_19abe960-4109-11eb-bcd0-a98c14e187f6',
},
{
name: '城运信息系统',
id: 'page_af847490-3937-11eb-8bd2-af9cb9e97668',
},
{ name: '政府机关系统' },
{ name: '党建信息系统' },
{ name: '预案文件信息系统' },
{ name: '规划信息系统' },
{ name: '更多系统' },
],
},
{
name: '管服务',
list: [
{
name: '电梯信息系统',
id: 'page_87f75700-41d7-11eb-84c4-f9d93e21eaf4',
},
{ name: '设施信息系统' },
{ name: '人才公寓信息系统' },
{ name: '物业信息体统' },
{ name: '更多系统' },
],
},
],
},
{
key: 'application',
name: '应用',
children: [],
},
]
src/view/components/basic-info.vue
View file @ f1dd58a0
......@@ -7,6 +7,11 @@
default-expanded-names="1"
accordion
>
<template #arrow>
<n-icon size=".08rem">
<CaretForward />
</n-icon>
</template>
<n-collapse-item name="1">
<div class="info-wrapper">
<div class="sum">
......@@ -87,8 +92,15 @@
<script lang="ts" setup>
import { ChartTypes } from '@/components/MyComponent'
import { ref, PropType, computed } from 'vue'
import { ref, PropType, computed, onMounted } from 'vue'
import { CaretForward } from '@vicons/ionicons5'
import { useFetchOrg, useFetchMember } from '@/hooks/useFetch'
import store from '@/store'
import dayjs from '@/util/dayjs'
onMounted(() => {
console.log('mounted')
})
const show = computed(() => store.state.showBasicInfo)
const props = defineProps({
......@@ -100,11 +112,34 @@ const props = defineProps({
const visible = computed(() => props.visible)
const sumList = [
{ name: '党组织', value: 355, unit: '个' },
{ name: '关系在街道内党员', value: 10890, unit: '位' },
{ name: '街道居民党员', value: 10890, unit: '位' },
]
const sumList = ref([
{ name: '党组织', value: 0, unit: '个' },
{ name: '关系在街道内党员', value: 0, unit: '位' },
{ name: '街道居民党员', value: 0, unit: '位' },
])
const getSumList = async () => {
const orgNum =
(
await useFetchOrg({
a: 'id,count',
keys: '是否虚拟组织',
})
)?.find((e: any) => !e['是否虚拟组织'])?.__aggregate__ || 0
const member = await useFetchMember({
a: 'id,count',
keys: '是否居住在花木街道',
})
const inHuamu =
member?.find((e: any) => e['是否居住在花木街道'])?.__aggregate__ || 0
const notInHuamu =
member?.find((e: any) => !e['是否居住在花木街道'])?.__aggregate__ || 0
sumList.value = [
{ name: '党组织', value: orgNum, unit: '个' },
{ name: '关系在街道内党员', value: inHuamu + notInHuamu, unit: '位' },
{ name: '街道居民党员', value: inHuamu, unit: '位' },
]
}
const color1 = ['#FAADB8', '#C1474F', '#6D2C29']
const color2 = ['#FAADB8', '#DD505E', '#A53D40', '#6D2C29']
......@@ -132,11 +167,10 @@ const lineOption: ChartTypes.LineOption = {
yAxis: [
{
type: 'value',
minInterval: 100,
maxInterval: 100,
interval: 100,
// minInterval: 100,
// maxInterval: 100,
// interval: 100,
splitLine: {
interval: 100,
lineStyle: {
type: 'dashed',
},
......@@ -163,43 +197,132 @@ const lineOption: ChartTypes.LineOption = {
},
],
}
const data1 = {
const data1 = ref({
dimensions: [
{ name: 'name', displayName: '类型' },
{ name: 'value', displayName: '数量' },
],
source: [
{ name: '机关事业单位党员', value: 6000, ratio: 60 },
{ name: '居民区党员', value: 3000, ratio: 30 },
{ name: '“两新”党员', value: 1000, ratio: 10 },
],
source: [],
})
const getData1 = async () => {
const res = await useFetchMember({
a: 'id,count',
keys: '党员类型',
})
const total = res.reduce(
(acc: number, cur: any) => acc + (cur.__aggregate__ || 0),
0,
)
data1.value.source = res.map((item: any) => ({
name: item['党员类型'],
value: item.__aggregate__ || 0,
ratio: Math.round(((item.__aggregate__ || 0) / total) * 100 || 0),
}))
}
const data2 = {
const data2 = ref({
dimensions: [
{ name: 'name', displayName: '类型' },
{ name: 'value', displayName: '数量' },
],
source: [
{ name: '党委', value: 10, ratio: 10 },
{ name: '党总支', value: 70, ratio: 70 },
{ name: '党支部', value: 10, ratio: 10 },
{ name: '联合党支部', value: 10, ratio: 10 },
{ name: '党委', value: 0, ratio: 0 },
{ name: '党总支', value: 0, ratio: 0 },
{ name: '党支部', value: 0, ratio: 0 },
{ name: '联合党支部', value: 0, ratio: 0 },
],
})
const getData2 = async () => {
const res = (
await useFetchOrg({
a: 'id,count',
keys: '等级',
})
)?.filter((e: any) => data2.value.source.some((n) => n.name === e['等级']))
const total = res.reduce(
(acc: number, cur: any) => acc + (cur.__aggregate__ || 0),
0,
)
data2.value.source.forEach((item) => {
const value =
res.find((e: any) => item.name === e['等级'])?.__aggregate__ || 0
item.value = value
item.ratio = Math.round((value / total) * 100)
})
}
const data3 = {
const data3 = ref({
dimensions: [
{ name: 'name', displayName: '年龄' },
{ name: 'value', displayName: '数量' },
],
source: [
{ name: '18-25岁', value: 210 },
{ name: '26-35岁', value: 320 },
{ name: '36-50岁', value: 150 },
{ name: '50-70岁', value: 80 },
{ name: '70岁以上', value: 270 },
{ name: '18-25岁', value: 0 },
{ name: '26-35岁', value: 0 },
{ name: '36-50岁', value: 0 },
{ name: '50-70岁', value: 0 },
{ name: '70岁以上', value: 0 },
],
})
const getData3 = async () => {
const source = [
{
name: '18-25岁',
range: [
dayjs().subtract(25, 'year').format('YYYY-MM-DD'),
dayjs().subtract(18, 'year').format('YYYY-MM-DD'),
],
},
{
name: '26-35岁',
range: [
dayjs().subtract(35, 'year').format('YYYY-MM-DD'),
dayjs().subtract(26, 'year').format('YYYY-MM-DD'),
],
},
{
name: '36-50岁',
range: [
dayjs().subtract(50, 'year').format('YYYY-MM-DD'),
dayjs().subtract(36, 'year').format('YYYY-MM-DD'),
],
},
{
name: '50-70岁',
range: [
dayjs().subtract(70, 'year').format('YYYY-MM-DD'),
dayjs().subtract(50, 'year').format('YYYY-MM-DD'),
],
},
{
name: '70岁以上',
range: [null, dayjs().subtract(71, 'year').format('YYYY-MM-DD')],
},
]
const res = await Promise.all(
source.map(({ range }) =>
useFetchMember({
a: 'id,count',
q: range[0]
? `paths @ "出生日期" && string >= "${range[0]}",paths @ "出生日期" && string <= "${range[1]}"`
: `paths @ "出生日期" && string <= "${range[1]}"`,
}),
),
)
data3.value.source.forEach(
(item, i) => (item.value = res[i]?.[0].__aggregate__ || 0),
)
console.log(res, data3.value)
}
onMounted(() => {
getSumList()
getData1()
getData2()
getData3()
})
const curTagKey = ref<string | null>(null)
const tagList = [
{ name: '机关事业单位党组织', key: '机关事业单位党组织' },
......@@ -212,6 +335,7 @@ const clickTag = (key: string) => {
return
}
curTagKey.value = key
// TODO 地图撒点
}
</script>
......@@ -288,7 +412,8 @@ const clickTag = (key: string) => {
font-family $font-din
margin-left .12rem
margin-right .2rem
&:last-child
float right
.tag-box
background $bg
$blur()
......@@ -306,11 +431,11 @@ const clickTag = (key: string) => {
$flex-align()
$text-overflow()
justify-content center
width 32%
background #fff
border-radius .03rem
cursor pointer
font-size .09rem
width 32%
&:hover
&.on
background $light-red
......
src/view/components/nav-bar.vue
View file @ f1dd58a0
......@@ -46,27 +46,25 @@
>
<svg-icon :data="nav3" original />
</n-icon>
<n-dropdown :options="options" show-arrow>
<div class="align-center">
<n-icon class="btn" size=".12rem" style="margin-right: 0">
<svg-icon :data="nav4" original />
</n-icon>
<n-icon size=".08rem">
<CaretDown />
</n-icon>
</div>
</n-dropdown>
</div>
<b>|</b>
<div class="align-center menu-btn">
<n-icon
size=".12rem"
style="margin-right: 0.05rem; margin-bottom: 0.03rem"
>
<svg-icon :data="nav5" original />
</n-icon>
选择菜单
</div>
<n-popover trigger="hover">
<template #trigger>
<div class="align-center menu-btn">
<n-icon
size=".12rem"
style="margin-right: 0.05rem; margin-bottom: 0.03rem"
>
<svg-icon :data="nav5" original />
</n-icon>
选择菜单
</div>
</template>
<div class="menu">
<div class="parent"></div>
<div class="children"></div>
</div>
</n-popover>
</div>
</div>
......@@ -78,7 +76,7 @@
</template>
<script lang="ts" setup>
import { computed, ref, watch } from 'vue'
import { computed, onMounted, ref, watch } from 'vue'
import store from '@/store'
import useDebounce from '@/hooks/useDebounce'
import SearchModal from './search-modal.vue'
......@@ -86,11 +84,9 @@ import FilterDrawer from './filter-drawer.vue'
import ActivityDrawer from './activity-drawer.vue'
import BuildingDrawer from './building-drawer.vue'
import StructModal from './struct-modal.vue'
import { CaretDown } from '@vicons/ionicons5'
import nav1 from '@images/nav1.svg'
import nav2 from '@images/nav2.svg'
import nav3 from '@images/nav3.svg'
import nav4 from '@images/nav4.svg'
import nav5 from '@images/nav5.svg'
const showFilterDrawer = computed(() => store.state.showFilterDrawer)
......@@ -180,6 +176,7 @@ watch(
handleSearch()
},
)
</script>
<style lang="stylus" scoped>
......
vite.config.js
View file @ f1dd58a0
......@@ -19,4 +19,13 @@ export default defineConfig({
'@images': resolve(__dirname, './src/assets/images'),
},
},
server: {
proxy: {
'/api': {
target: 'https://survey.maicedata.com/api/data/',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
},
},
},
})
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