elink-star
/
epmet-work-pc-chengyang
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

页面样式

feature
tianq 3 years ago
parent
0bca4fef0b
commit
0e4d08adde
7 changed files with 137 additions and 491 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 131
      src/views/dataBoard/fifteen/index.vue
  2. 87
      src/views/dataBoard/sida/cpts/fwqd.vue
  3. 16
      src/views/dataBoard/sida/cpts/sqpj.vue
  4. 88
      src/views/dataBoard/sida/cpts/wtqd.vue
  5. 91
      src/views/dataBoard/sida/cpts/xqqd.vue
  6. 86
      src/views/dataBoard/sida/cpts/zyqd.vue
  7. 129
      src/views/dataBoard/sida/fifteen.vue

131
src/views/dataBoard/fifteen/index.vue
View File

@ -1,66 +1,20 @@
<template>
<div>
<div class="g-row">
<div class="g-left">
<div class="m-box">
<div class="box-title">
<img src="~@/assets/images/shuju/main/card-title-bg-480.png" class="box-title-bg" />
<div class="box-title-txt">需求清单</div>
</div>
<div class="m-subbox"><xqqd :orgId="orgData.org_id"></xqqd></div>
</div>
<div class="m-box">
<div class="box-title">
<img src="~@/assets/images/shuju/main/card-title-bg-480.png" class="box-title-bg" />
<div class="box-title-txt">问题清单</div>
</div>
<div class="m-subbox"><wtqd :orgId="orgData.org_id"></wtqd></div>
</div>
</div>
<div class="g-center">
<div class="m-map">
<div class="m-search2">
<el-date-picker type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
<el-button type="primary">查询</el-button>
</div>
<grid-map ref="map" @clickAgency="clickAgencyItem" :srcGridData="orgData" @clickDotBtn="handleClickDotBtn" />
</div>
<div class="m-box ">
<div class="box-title">
<img src="~@/assets/images/shuju/main/card-title-bg-800.png" class="box-title-bg" />
<div class="box-title-txt">社区评价</div>
</div>
<div class="m-subbox"><sqpj :orgId="orgData.org_id"></sqpj></div>
</div>
</div>
<div class="g-right">
<div class="m-box">
<div class="box-title">
<div class="box-title-btn" @click="fwMore">
<img src="~@/assets/images/shuju/sida/index/more.png" />
<span>查看更多</span>
<div class="g-center" style="flex:1">
<div class="m-search" style="top:0px;width:600px">
<div class="card" style="height:60px;">
<div class="card-input">
<div class="card-btn" @click="handleSearch"><img src="~@/assets/images/shuju/renfang/index/search/search.png" /></div>
<input type="text" placeholder="搜索本组织及下级的居民、小区、楼栋、房屋" @keyup.enter="handleSearch" v-model="searchModule.keyword" />
<div class="i-div"></div>
<div class="card-btn"><img src="~@/assets/images/shuju/renfang/index/search/close.png" /></div>
</div>
<img src="~@/assets/images/shuju/main/card-title-bg-480.png" class="box-title-bg" />
<div class="box-title-txt" @click="fwMore">服务清单</div>
</div>
<div
class="m-subbox "
:class="{
'z-shrink': orgLevel == 'district' || orgLevel == 'street' || orgLevel == 'city'
}"
>
<fwqd :orgId="orgData.org_id"></fwqd>
</div>
</div>
<div class="m-box">
<div class="box-title">
<img src="~@/assets/images/shuju/main/card-title-bg-480.png" class="box-title-bg" />
<div class="box-title-txt">资源清单</div>
</div>
<div class="m-subbox"><zyqd :orgId="orgData.org_id"></zyqd></div>
</div>
<div class="m-map"><grid-map ref="map" @clickAgency="clickAgencyItem" :srcGridData="orgData" @clickDotBtn="handleClickDotBtn" /></div>
</div>
<div class="g-right"></div>
<cpt-loading v-show="false" />
</div>
</div>
@ -90,6 +44,17 @@ export default {
},
data() {
return {
searchModule: {
displayedCard: false,
keyword: '',
resultTab: '0', // 0所有 1，居民；2，小区；3，楼栋；4，房屋
result: [
// {
// id: 1,
// title: "四季景园",
// },
]
},
loading: false,
orgData: {
children: []
@ -167,7 +132,61 @@ export default {
// },
// 根据类别搜索
async handleSearch() {
this.searchModule.result = [];
console.log(this.searchModule);
const { searchModule } = this;
const url = ['search_all', 'search_resident', 'search_village', 'search_building', 'search_house'][searchModule.resultTab];
const { data, code, msg } = await requestPostBi(
url,
{
queryParam: {
org_id: this.orgId,
name: this.searchModule.keyword
}
},
{
// mockId: 60044224,
// mockId: 60048067,
}
);
if (code === 0) {
this.searchModule.result = data.map(item => {
let type = item.type || searchModule.resultTab;
let title = '';
let detailJson = {};
if (searchModule.resultTab == 0) {
title = item.name;
if (typeof item.detail_json == 'string') {
try {
detailJson = JSON.parse(item.detail_json);
} catch (e) {
console.log(e);
}
}
} else if (type == '1') {
title = item.user_name;
} else if (type == '2') {
title = item.village_name;
} else if (type == '3') {
title = item.village_name + '-' + item.building_name;
} else if (type == '4') {
title = item.building + '-' + item.unit + '-' + item.door;
}
return {
title,
type,
...detailJson,
...item
};
});
} else {
this.$message.error(msg);
}
},
//获取地图上显示的组织数据
async getMapData() {
console.log('=========================getMapData');

87
src/views/dataBoard/sida/cpts/fwqd.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="m-fwqd">
<div class="tablist">
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="currentTab = item">{{ item }}</div>
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="handleClick(item)">{{ item }}</div>
</div>
<div class="pieMain">
<div class="legend">
@ -30,6 +30,7 @@ export default {
},
data() {
return {
data: {},
showNoData: false,
timer: null,
pieChart: '',
@ -41,38 +42,7 @@ export default {
'个性服务'
// "下级人口分布",
],
currentTab: '公共服务',
info: {
male_count: 0,
female_count: 0,
resi_y_house_y_count: 0,
resi_y_house_n_count: 0,
resi_n_house_y_count: 0,
primary_count: 0,
junior_high_count: 0,
second_speci_count: 0,
high_school_count: 0,
junior_college_count: 0,
undergrad_count: 0,
master_count: 0,
doctor_count: 0,
local_count: 0,
field_count: 0,
age50_count: 0,
age5059_count: 0,
age6069_count: 0,
age7079_count: 0,
age80_count: 0,
culture_count: 0,
committee_count: 0,
capable_count: 0,
friend_count: 0,
agent_count: 0,
mediator_count: 0,
collector_count: 0,
security_count: 0,
party_mem_count: 0
}
currentTab: '公共服务'
};
},
components: {
@ -82,14 +52,15 @@ export default {
this.init();
},
watch: {
currentTab() {
this.setPieData();
},
orgId() {
this.init();
}
},
methods: {
handleClick(item) {
this.currentTab = item;
this.getInfo();
},
async init() {
await this.getInfo();
this.getPie();
@ -110,11 +81,11 @@ export default {
async getInfo() {
let url = '';
if (this.currentTab == '公共服务') {
url = 'people_res_view';
url = 'common_service_view';
} else {
url = 'goods_res_view';
url = 'self_service_views';
}
this.$refs.pieChart.showLoading();
const { data, code, msg } = await requestPostBi(
url,
@ -136,19 +107,13 @@ export default {
...info
};
}
this.data = data;
this.setPieData();
} else {
this.$message.error(msg);
}
},
selItem(selItem, selIndex) {
this.tabList.forEach((element, index) => {
if (index === selIndex) {
element.sel = true;
} else {
element.sel = false;
}
});
},
pieInitOk() {
this.pieInitState = true;
},
@ -162,32 +127,10 @@ export default {
}
},
setPieData() {
const { currentTab, info } = this;
let { data } = this;
let data = [
{
name: '江',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
},
{
name: '平',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 63
},
{
name: '究',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 66
},
{
name: '布',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
}
];
data = JSON.parse(JSON.stringify(data).replace(/count/g, 'value'));
console.log('data', data);
this.pieData = data;
this.iniPieChart();

16
src/views/dataBoard/sida/cpts/sqpj.vue
View File

@ -110,26 +110,18 @@ export default {
// }
// });
},
selItem(selItem, selIndex) {
this.tabList.forEach((element, index) => {
if (index === selIndex) {
element.sel = true;
} else {
element.sel = false;
}
});
},
async getResiCategoryData() {
let url = '';
if (this.currentTab == '满意度') {
url = 'self_need_view';
url = 'satis_eval_view';
} else if (this.currentTab == '关注度') {
url = 'attention_eval_view';
} else if (this.currentTab == '期盼度') {
url = 'self_need_view';
url = 'expect_eval_view';
} else {
// 烦心度
url = 'self_need_view';
url = 'upset_eval_view';
}
const { data, code, msg } = await requestPostBi(

88
src/views/dataBoard/sida/cpts/wtqd.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="m-wtqd">
<div class="tablist">
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="currentTab = item">{{ item }}</div>
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="handleClick(item)">{{ item }}</div>
</div>
<div class="pieMain">
<div class="legend">
@ -30,6 +30,7 @@ export default {
},
data() {
return {
data: {},
showNoData: false,
timer: null,
pieChart: '',
@ -42,38 +43,7 @@ export default {
'综治人群'
// "下级人口分布",
],
currentTab: '治理事件',
info: {
male_count: 0,
female_count: 0,
resi_y_house_y_count: 0,
resi_y_house_n_count: 0,
resi_n_house_y_count: 0,
primary_count: 0,
junior_high_count: 0,
second_speci_count: 0,
high_school_count: 0,
junior_college_count: 0,
undergrad_count: 0,
master_count: 0,
doctor_count: 0,
local_count: 0,
field_count: 0,
age50_count: 0,
age5059_count: 0,
age6069_count: 0,
age7079_count: 0,
age80_count: 0,
culture_count: 0,
committee_count: 0,
capable_count: 0,
friend_count: 0,
agent_count: 0,
mediator_count: 0,
collector_count: 0,
security_count: 0,
party_mem_count: 0
}
currentTab: '治理事件'
};
},
components: {
@ -83,14 +53,15 @@ export default {
this.init();
},
watch: {
currentTab() {
this.setPieData();
},
orgId() {
this.init();
}
},
methods: {
handleClick(item) {
this.currentTab = item;
this.getInfo();
},
async init() {
await this.getInfo();
this.getPie();
@ -110,14 +81,14 @@ export default {
// 获取房屋总数等
async getInfo() {
let url = '';
console.log(this.currentTab);
if (this.currentTab == '治理事件') {
url = 'people_res_view';
url = 'event_view';
} else if (this.currentTab == '安全隐患') {
url = 'goods_res_view';
url = 'risk_view';
} else {
url = 'people_res_view';
url = 'special_view';
}
this.$refs.pieChart.showLoading();
const { data, code, msg } = await requestPostBi(
url,
@ -139,19 +110,12 @@ export default {
...info
};
}
this.data = data;
this.setPieData();
} else {
this.$message.error(msg);
}
},
selItem(selItem, selIndex) {
this.tabList.forEach((element, index) => {
if (index === selIndex) {
element.sel = true;
} else {
element.sel = false;
}
});
},
pieInitOk() {
this.pieInitState = true;
},
@ -165,34 +129,10 @@ export default {
}
},
setPieData() {
const { currentTab, info } = this;
let data = [
{
name: '江',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
},
{
name: '平',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 63
},
{
name: '究',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 66
},
{
name: '布',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
}
];
let { data } = this;
data = JSON.parse(JSON.stringify(data).replace(/count/g, 'value'));
console.log('data', data);
this.pieData = data;
this.iniPieChart();
},
// 获取饼状图

91
src/views/dataBoard/sida/cpts/xqqd.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="m-xqqd">
<div class="tablist">
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="currentTab = item">{{ item }}</div>
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="handleClick(item)">{{ item }}</div>
</div>
<div class="pieMain">
<div class="legend">
@ -30,49 +30,15 @@ export default {
},
data() {
return {
data: {},
showNoData: false,
timer: null,
pieChart: '',
pieOption: {},
pieInitState: false,
pieData: [],
tabList: [
'个性需求',
'共性需求'
// "下级人口分布",
],
currentTab: '个性需求',
info: {
male_count: 0,
female_count: 0,
resi_y_house_y_count: 0,
resi_y_house_n_count: 0,
resi_n_house_y_count: 0,
primary_count: 0,
junior_high_count: 0,
second_speci_count: 0,
high_school_count: 0,
junior_college_count: 0,
undergrad_count: 0,
master_count: 0,
doctor_count: 0,
local_count: 0,
field_count: 0,
age50_count: 0,
age5059_count: 0,
age6069_count: 0,
age7079_count: 0,
age80_count: 0,
culture_count: 0,
committee_count: 0,
capable_count: 0,
friend_count: 0,
agent_count: 0,
mediator_count: 0,
collector_count: 0,
security_count: 0,
party_mem_count: 0
}
tabList: ['个性需求', '共性需求'],
currentTab: '个性需求'
};
},
components: {
@ -82,19 +48,22 @@ export default {
this.init();
},
watch: {
currentTab() {
this.setPieData();
},
orgId() {
this.init();
}
},
methods: {
handleClick(item) {
this.currentTab = item;
this.getInfo();
},
async init() {
await this.getInfo();
this.getPie();
},
handleClickItem(item) {
console.log('dd');
// this.getInfo()
// const { type, name } = item;
// this.$router.push({
// path: '/dataBoard/renfang/resi-analyze',
@ -128,6 +97,7 @@ export default {
}
);
this.$refs.pieChart.hideLoading();
if (code === 0) {
if (data && Array.isArray(data) && data.length > 0) {
let info = data[0];
@ -136,19 +106,13 @@ export default {
...info
};
}
this.data = data;
this.setPieData();
} else {
this.$message.error(msg);
}
},
selItem(selItem, selIndex) {
this.tabList.forEach((element, index) => {
if (index === selIndex) {
element.sel = true;
} else {
element.sel = false;
}
});
},
pieInitOk() {
this.pieInitState = true;
},
@ -162,34 +126,9 @@ export default {
}
},
setPieData() {
const { currentTab, info } = this;
let data = [
{
name: '江',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
},
{
name: '平',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 63
},
{
name: '究',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 66
},
{
name: '布',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
}
];
let { data } = this;
data = JSON.parse(JSON.stringify(data).replace(/count/g, 'value'));
console.log('data', data);
this.pieData = data;
this.iniPieChart();
},
// 获取饼状图

86
src/views/dataBoard/sida/cpts/zyqd.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="m-zyqd">
<div class="tablist">
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="currentTab = item">{{ item }}</div>
<div v-for="item in tabList" :key="item" :class="['item', { 'item-sel': currentTab == item }]" @click="handleClick(item)">{{ item }}</div>
</div>
<div class="pieMain">
<div class="legend">
@ -30,6 +30,7 @@ export default {
},
data() {
return {
data: {},
showNoData: false,
timer: null,
pieChart: '',
@ -42,38 +43,7 @@ export default {
'场所资源'
// "下级人口分布",
],
currentTab: '人资源',
info: {
male_count: 0,
female_count: 0,
resi_y_house_y_count: 0,
resi_y_house_n_count: 0,
resi_n_house_y_count: 0,
primary_count: 0,
junior_high_count: 0,
second_speci_count: 0,
high_school_count: 0,
junior_college_count: 0,
undergrad_count: 0,
master_count: 0,
doctor_count: 0,
local_count: 0,
field_count: 0,
age50_count: 0,
age5059_count: 0,
age6069_count: 0,
age7079_count: 0,
age80_count: 0,
culture_count: 0,
committee_count: 0,
capable_count: 0,
friend_count: 0,
agent_count: 0,
mediator_count: 0,
collector_count: 0,
security_count: 0,
party_mem_count: 0
}
currentTab: '人资源'
};
},
components: {
@ -83,14 +53,15 @@ export default {
this.init();
},
watch: {
currentTab() {
this.setPieData();
},
orgId() {
this.init();
}
},
methods: {
handleClick(item) {
this.currentTab = item;
this.getInfo();
},
async init() {
await this.getInfo();
this.getPie();
@ -114,10 +85,10 @@ export default {
url = 'people_res_view';
} else if (this.currentTab == '物资源') {
url = 'goods_res_view';
}else{
url = 'people_res_view';
} else {
url = 'place_res_view';
}
this.$refs.pieChart.showLoading();
const { data, code, msg } = await requestPostBi(
url,
@ -139,19 +110,13 @@ export default {
...info
};
}
this.data = data;
this.setPieData();
} else {
this.$message.error(msg);
}
},
selItem(selItem, selIndex) {
this.tabList.forEach((element, index) => {
if (index === selIndex) {
element.sel = true;
} else {
element.sel = false;
}
});
},
pieInitOk() {
this.pieInitState = true;
},
@ -165,30 +130,7 @@ export default {
}
},
setPieData() {
const { currentTab, info } = this;
let data = [
{
name: '江',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
},
{
name: '平',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 63
},
{
name: '究',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 66
},
{
name: '布',
org_id: '7b6f9a9f9f38d5f9fa7ce94a93d6eb28',
count: 61
}
];
let { data } = this;
data = JSON.parse(JSON.stringify(data).replace(/count/g, 'value'));
console.log('data', data);
this.pieData = data;

129
src/views/dataBoard/sida/fifteen.vue
View File

@ -1,129 +0,0 @@
<template>
<div>
<cpt-bread @tap="handleClickBreadItem" v-if="breadList.length > 1" :bread-list="breadList" />
<div class="g-row">
<div class="g-left">
<div class="m-box">
<div class="m-title">
<img class="title_img" src="@/assets/images/index/list-logo.png" alt />
<div class="tip_title">公共服务数据统计</div>
<div class="title_line"></div>
</div>
<div class="m-height"><fw01 :orgId="orgId"></fw01></div>
</div>
</div>
<div class="g-center">
<div class="m-box">
<div class="m-title">
<img class="title_img" src="@/assets/images/index/list-logo.png" alt />
<div class="tip_title">共性需求待响应</div>
<div class="title_line"></div>
</div>
<div class="m-height"><fw02 :orgId="orgId"></fw02></div>
</div>
</div>
<div class="g-right">
<div class="m-box">
<div class="m-title">
<img class="title_img" src="@/assets/images/index/list-logo.png" alt />
<div class="tip_title">服务找人数据统计</div>
<div class="title_line"></div>
</div>
<div class="m-height"><fw03 :orgId="orgId"></fw03></div>
</div>
</div>
</div>
<div class="g-row">
<div class="g-left" style="width:920px">
<div class="m-box">
<div class="m-title">
<img class="title_img" src="@/assets/images/index/list-logo.png" alt />
<div class="tip_title">个性服务数据统计</div>
<div class="title_line"></div>
</div>
<div class="m-height "><fw04 :orgId="orgId"></fw04></div>
</div>
</div>
<div class="g-left" style="width:920px">
<div class="m-box">
<div class="m-title">
<img class="title_img" src="@/assets/images/index/list-logo.png" alt />
<div class="tip_title">政策找人数据统计</div>
<div class="title_line"></div>
</div>
<div class="m-height"><fw05 :orgId="orgId"></fw05></div>
</div>
</div>
<!-- <cpt-loading v-show="false" /> -->
</div>
</div>
</template>
<script>
import fw01 from '@/views/dataBoard/sida/cpts/fw01gg';
import fw02 from '@/views/dataBoard/sida/cpts/fw02gxxq';
import fw03 from '@/views/dataBoard/sida/cpts/fw03zr';
import fw04 from '@/views/dataBoard/sida/cpts/fw04gx';
import fw05 from '@/views/dataBoard/sida/cpts/fw05zc';
import cptBread from '@/views/dataBoard/renfang/cpts/bread';
export default {
props: {
orgId: {
type: String,
default: ''
}
},
components: {
fw01,
fw02,
fw03,
fw04,
fw05,
cptBread
},
data() {
return {
showNoData: false,
barChart: '',
barOption: {},
barInitState: false,
barData: [],
breadList: [
{
type: 'back',
meta: {
title: '四大清单'
}
},
{
meta: {
title: '服务清单数据统计'
}
}
]
};
},
mounted() {},
watch: {},
methods: {
handleClickBreadItem({ item }) {
if (item.type == 'back') {
this.$router.back();
}
},
toListPage(type = '', type_name = '') {
this.$router.push({
path: '/dataBoard/renfang/house-list',
query: {
org_id: this.orgId,
type,
type_name
}
});
}
}
};
</script>
<style lang="scss" src="@/assets/scss/dataBoard/renfang/index.scss" scoped></style>
<style lang="scss" src="@/assets/scss/dataBoard/listBox.scss" scoped></style>
Write Preview
Loading…
Cancel
Save