Skip to content

F
founder_vue
Commit a8a9fa82 by 刘玉帅
Options

Merge branch 'sn_snzz' of http://47.92.108.28/changchao/founder_vue into sn_snzz

parents cad0c8fe 1d77dbb7
Showing with 736 additions and 65 deletions
src/api/ywxtdd/index.js
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-08-06 09:29:24 * @Date: 2021-08-06 09:29:24
* @LastEditTime: 2021-08-09 17:42:20 * @LastEditTime: 2021-08-13 14:28:44
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\api\ywxtdd\index.js * @FilePath: \founder_vue\src\api\ywxtdd\index.js
...@@ -50,4 +50,22 @@ export const queryHandleTaskJbxxList = params => ...@@ -50,4 +50,22 @@ export const queryHandleTaskJbxxList = params =>
postJson(`${baseUrl}/TastManage/queryHandleTaskJbxxList`, params) postJson(`${baseUrl}/TastManage/queryHandleTaskJbxxList`, params)
//任务处理 //任务处理
export const handleTask = params => export const handleTask = params =>
postJson(`${baseUrl}/TastManage/HandleTask`, params) postJson(`${baseUrl}/TastManage/HandleTask`, params)
\ No newline at end of file //人口状况分析
export const rkzk = params =>
postJson(`${baseUrl}/tjfx/Rkzk`, params)
//重点青少年信息分析
export const zdqsn = params =>
postJson(`${baseUrl}/tjfx/Zdqsn`, params)
//社会组织分析
export const shzz = params =>
postJson(`${baseUrl}/tjfx/Shzz`, params)
//社会治安分析
export const shza = params =>
postJson(`${baseUrl}/tjfx/Shza`, params)
//重大事件预警分析
export const zdsj = params =>
postJson(`${baseUrl}/tjfx/Zdsj`, params)
//可视化分析
export const ksh = params =>
postJson(`${baseUrl}/tjfx/Ksh`, params)
src/assets/jsData/tjfx_code.js 0 → 100644
/*
* @Author: your name
* @Date: 2021-08-13 14:39:21
* @LastEditTime: 2021-08-13 16:01:58
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \founder_vue\src\assets\jsData\tjfx_code.js
*/
export var code = {
asjdj: {
'01': '特别重大',
'02': '重大',
'03': '较大',
'04': '一般',
},
shzzlx: {
'01': '专职巡防队伍',
'02': '义务巡防队伍',
'03': '保安服务公司',
'04': '志愿者队伍',
'99': '其他'
},
xbbl: {
'1': '男',
'2': '女'
},
zazdlx: {
'1': '命案',
'2': '入室盗窃',
'3': '抢劫抢夺',
'4': '电信诈骗',
'5': '拎包诈骗',
'6': '偷盗机动车',
'7': '卖淫嫖娼',
'8': '赌博',
'9': '拐卖妇女儿童',
'10': '制假贩假',
'11': '制黄贩黄',
'12': '高利贷',
'13': '强买强',
'14': '交通秩序混乱',
'99': '其他',
},
whcd: {
'10': '研究生教育',
'11': '博士研究生毕业',
'12': '博士研究生结业',
'13': '博士研究生肄业',
'14': '硕士研究生毕业',
'15': '硕士研究生结业',
'16': '硕士研究生肄业',
'17': '研究生班毕业',
'18': '研究生班结业',
'19': '研究生班肄业',
'20': '大学本科教育',
'21': '大学本科毕业',
'22': '大学本科结业',
'23': '大学本科肄业',
'28': '大学普通班毕业',
'30': '大学专科教育',
'31': '大学专科毕业',
'32': '大学专科结业',
'33': '大学专科肄业',
'40': '中等职业教育',
'41': '中等专科毕业',
'42': '中等专科结业',
'43': '中等专科肄业',
'44': '职业高中毕业',
'45': '职业高中结业',
'46': '职业高中肄业',
'47': '技工学校毕业',
'48': '技工学校结业',
'49': '技工学校肄业',
'60': '普通高级中学教育',
'61': '普通高中毕业',
'62': '普通高中结业',
'63': '普通高中肄业',
'70': '初级中学教育',
'71': '初中毕业',
'73': '初中肄业',
'80': '小学教育',
'81': '小学毕业',
'83': '小学肄业',
'90': '其他'
},
zdqsnlx: {
'01': '闲散青少年',
'02': '有不良行为或严重不良行为青少年',
'03': '流浪乞讨未成年人',
'04': '服刑人员未成年子女',
'05': '农村留守儿童',
'99': '其他'
}
}
\ No newline at end of file
src/components/Person_Echarts.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-11 15:23:42 * @LastEditTime: 2021-08-13 15:58:30
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
...@@ -30,6 +30,7 @@ export default { ...@@ -30,6 +30,7 @@ export default {
data() { data() {
return { return {
props: utils.deepClone(this.chartsProps), props: utils.deepClone(this.chartsProps),
data: utils.deepClone(this.chartsData),
pieData: [ pieData: [
{ {
name: "大学及以上", name: "大学及以上",
...@@ -76,14 +77,34 @@ export default { ...@@ -76,14 +77,34 @@ export default {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
chartsData: {
type: Array,
default: () => [],
},
}, },
mounted() { watch: {
// console.log(); chartsData: {
setPieDiagram(this.$refs["rkqsfx"][0], this.pieData); handler(val) {
setBarDiagram(this.$refs["czrkqyfb"][0], this.x, this.barData, null, 30); this.data = utils.deepClone(val);
setAcrossBar(this.$refs["ldrkqyfb"][0], this.x, this.data2, this.data3); this.getCharts();
setLineDiagram(this.$refs["wlhrkqyfb"][0], this.data4, this.data5); },
deep: true,
},
},
methods: {
getCharts() {
this.data.forEach((i) => {
if (i.type == "pie") {
setPieDiagram(this.$refs[i.res][0], i.data);
} else if (i.type == "bar") {
let x = i.data.map((i) => i.name);
let data = i.data.map((i) => i.value);
setBarDiagram(this.$refs[i.res][0], x, data);
}
});
},
}, },
mounted() {},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
src/utils/echarts.js
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-08-10 17:53:10 * @Date: 2021-08-10 17:53:10
* @LastEditTime: 2021-08-11 15:30:47 * @LastEditTime: 2021-08-13 14:04:16
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\utils\echarts.js * @FilePath: \founder_vue\src\utils\echarts.js
...@@ -27,6 +27,7 @@ export function setPieDiagram(dom, data, colorList) { ...@@ -27,6 +27,7 @@ export function setPieDiagram(dom, data, colorList) {
myChart.setOption({ myChart.setOption({
tooltip: { tooltip: {
trigger: "item", trigger: "item",
transitionDuration: '0'
}, },
legend: { legend: {
type: "plain", type: "plain",
...@@ -83,6 +84,7 @@ export function setBarDiagram(dom, x, data, barColor, rotate) { ...@@ -83,6 +84,7 @@ export function setBarDiagram(dom, x, data, barColor, rotate) {
myChart.setOption({ myChart.setOption({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
transitionDuration: '0',
axisPointer: { axisPointer: {
// 坐标轴指示器，坐标轴触发有效 // 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow' type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
......
src/views/Home.vue
...@@ -90,7 +90,6 @@ export default { ...@@ -90,7 +90,6 @@ export default {
}, },
methods: { methods: {
handleOpen(key, keyPath) { handleOpen(key, keyPath) {
debugger;
console.log(key, keyPath); console.log(key, keyPath);
}, },
handleClose(key, keyPath) { handleClose(key, keyPath) {
......
src/views/tjfx/kshfx.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-10 17:40:39 * @LastEditTime: 2021-08-13 16:31:03
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
--> -->
<template> <template>
<div id="rkzjfx"> <div id="kshfx" v-loading="loading">
<PersonEcharts :chartsProps="chartsProps"></PersonEcharts> <PersonEcharts
:chartsProps="chartsProps"
:chartsData="chartsData"
></PersonEcharts>
</div> </div>
</template> </template>
<script> <script>
import PersonEcharts from "@c/Person_Echarts.vue"; import PersonEcharts from "@c/Person_Echarts.vue";
import { ksh, shza } from "@/api/ywxtdd";
import { code } from "@/assets/jsData/tjfx_code.js";
export default { export default {
data() { data() {
return { return {
loading: false,
loadingNumber: 0,
chartsProps: [ chartsProps: [
{ {
ref: "rkqsfx", ref: "zdry",
title: "人口趋势分析", title: "重点人员",
col: "3", col: "3",
}, },
{ {
ref: "czrkqyfb", ref: "tsrq",
title: "常住人口区域分布", title: "特殊人群",
col: "3", col: "3",
}, },
{ {
ref: "ldrkqyfb", ref: "shzz",
title: "流动人口区域分布", title: "社会组织",
col: "3", col: "3",
}, },
{ {
ref: "wlhrkqyfb", ref: "zdsj",
title: "未落户人口区域分布", title: "重大事件",
col: "3", col: "3",
}, },
{ {
ref: "syfwqyfb", ref: "zdqy",
title: "实有房屋区域分布", title: "重点区域",
col: "3", col: "3",
}, },
{
ref: "zaaj",
title: "治安案件",
col: "3",
},
],
chartsData: [
{
res: "tsrq",
params: {
lx: "2",
},
type: "pie",
data: [],
},
{
res: "shzz",
params: {
lx: "3",
},
type: "pie",
code: "shzzlx",
data: [],
},
{
res: "zdqy",
params: {
lx: "1",
},
type: "pie",
data: [],
},
{
res: "zdry",
code: "asjdj",
type: "pie",
data: [
{
name: "闲散青少年",
value: "4",
},
{
name: "农村留守儿童",
value: "12",
},
{
name: "服刑人员未成年子女",
value: "3",
},
{
name: "流浪乞讨未成年人",
value: "2",
},
],
},
{
res: "zdsj",
code: "asjdj",
type: "pie",
data: [
{
name: "一般",
value: "14",
},
{
name: "特别重大",
value: "5",
},
{
name: "重大",
value: "8",
},
{
name: "较大",
value: "2",
},
],
},
{
res: "zaaj",
code: "asjdj",
type: "pie",
data: [
{
name: "一般",
value: "14",
},
{
name: "特别重大",
value: "18",
},
{
name: "重大",
value: "7",
},
{
name: "较大",
value: "5",
},
],
},
], ],
}; };
}, },
components: { components: {
PersonEcharts, PersonEcharts,
}, },
methods: {
getChartsData() {
this.chartsData.forEach((i, index) => {
if (i.data.length <= 0) {
this.loadingNumber++;
if (i.res == "zdqy") {
shza(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
} else {
ksh(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
}
}
});
},
},
watch: {
loadingNumber(val) {
if (val != 0) {
this.loading = true;
} else {
this.loading = false;
}
},
},
mounted() { mounted() {
// console.log(this.$refs["syfwqyfb"][0]); this.getChartsData();
}, },
}; };
</script> </script>
src/views/tjfx/rkzjfx.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-11 09:17:22 * @LastEditTime: 2021-08-13 16:32:20
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
--> -->
<template> <template>
<div id="rkzjfx"> <div id="rkzjfx" v-loading="loading">
<PersonEcharts :chartsProps="chartsProps"></PersonEcharts> <PersonEcharts
:chartsProps="chartsProps"
:chartsData="chartsData"
></PersonEcharts>
</div> </div>
</template> </template>
<script> <script>
import PersonEcharts from "@c/Person_Echarts.vue"; import PersonEcharts from "@c/Person_Echarts.vue";
import { rkzk } from "@/api/ywxtdd";
import { code } from "@/assets/jsData/tjfx_code.js";
export default { export default {
data() { data() {
return { return {
loading: false,
loadingNumber: 0,
chartsProps: [ chartsProps: [
{ {
ref: "rkqsfx", ref: "rkqsfx",
...@@ -43,13 +50,86 @@ export default { ...@@ -43,13 +50,86 @@ export default {
col: "3", col: "3",
}, },
], ],
chartsData: [
{
res: "rkqsfx",
params: {
lx: "1",
},
type: "pie",
data: [],
},
{
res: "czrkqyfb",
params: {
lx: "2",
},
type: "pie",
data: [],
},
{
res: "ldrkqyfb",
params: {
lx: "3",
},
type: "pie",
data: [],
},
{
res: "wlhrkqyfb",
params: {
lx: "4",
},
type: "pie",
data: [],
},
{
res: "syfwqyfb",
params: {
lx: "5",
},
type: "pie",
data: [],
},
],
}; };
}, },
components: { components: {
PersonEcharts, PersonEcharts,
}, },
methods: {
getChartsData() {
this.chartsData.forEach((i, index) => {
if (i.data.length <= 0) {
this.loadingNumber++;
rkzk(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
}
});
},
},
watch: {
loadingNumber(val) {
if (val != 0) {
this.loading = true;
} else {
this.loading = false;
}
},
},
mounted() { mounted() {
// console.log(this.$refs["rkqsfx"]); this.getChartsData();
}, },
}; };
</script> </script>
src/views/tjfx/shzatjfx.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-10 17:45:49 * @LastEditTime: 2021-08-13 16:38:13
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
--> -->
<template> <template>
<div id="rkzjfx"> <div id="shzatjfx" v-loading="loading">
<PersonEcharts :chartsProps="chartsProps"></PersonEcharts> <PersonEcharts
:chartsProps="chartsProps"
:chartsData="chartsData"
></PersonEcharts>
</div> </div>
</template> </template>
<script> <script>
import PersonEcharts from "@c/Person_Echarts.vue"; import PersonEcharts from "@c/Person_Echarts.vue";
import { shza } from "@/api/ywxtdd";
import { code } from "@/assets/jsData/tjfx_code.js";
export default { export default {
data() { data() {
return { return {
loading: false,
loadingNumber: 0,
chartsProps: [ chartsProps: [
{ {
ref: "pczzs", ref: "pczzs",
...@@ -28,13 +35,63 @@ export default { ...@@ -28,13 +35,63 @@ export default {
col: "5", col: "5",
}, },
], ],
chartsData: [
{
res: "pczzs",
params: {
lx: "1",
},
type: "bar",
data: [],
},
{
res: "lxfb",
params: {
lx: "2",
},
code: "zazdlx",
type: "pie",
data: [],
},
],
}; };
}, },
components: { components: {
PersonEcharts, PersonEcharts,
}, },
methods: {
getChartsData() {
this.chartsData.forEach((i, index) => {
if (i.data.length <= 0) {
this.loadingNumber++;
shza(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
}
});
},
},
watch: {
loadingNumber(val) {
if (val != 0) {
this.loading = true;
} else {
this.loading = false;
}
},
},
mounted() { mounted() {
// console.log(this.$refs["syfwqyfb"][0]); this.getChartsData();
}, },
}; };
</script> </script>
src/views/tjfx/shzzfx.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-10 17:45:04 * @LastEditTime: 2021-08-13 16:34:43
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
--> -->
<template> <template>
<div id="rkzjfx"> <div id="shzzfx" v-loading="loading">
<PersonEcharts :chartsProps="chartsProps"></PersonEcharts> <PersonEcharts
:chartsProps="chartsProps"
:chartsData="chartsData"
></PersonEcharts>
</div> </div>
</template> </template>
<script> <script>
import PersonEcharts from "@c/Person_Echarts.vue"; import PersonEcharts from "@c/Person_Echarts.vue";
import { shzz } from "@/api/ywxtdd";
import { code } from "@/assets/jsData/tjfx_code.js";
export default { export default {
data() { data() {
return { return {
loading: false,
loadingNumber: 0,
chartsProps: [ chartsProps: [
{ {
ref: "qyfb", ref: "qyfb",
title: "区域分布", title: "区域分布",
col: "10", col: "10",
} },
],
chartsData: [
{
res: "qyfb",
params: {},
type: "bar",
data: [],
},
], ],
}; };
}, },
components: { components: {
PersonEcharts, PersonEcharts,
}, },
methods: {
getChartsData() {
this.chartsData.forEach((i, index) => {
if (i.data.length <= 0) {
this.loadingNumber++;
shzz(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
}
});
},
},
watch: {
loadingNumber(val) {
if (val != 0) {
this.loading = true;
} else {
this.loading = false;
}
},
},
mounted() { mounted() {
// console.log(this.$refs["syfwqyfb"][0]); this.getChartsData();
}, },
}; };
</script> </script>
src/views/tjfx/zdqsnxxfx.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-10 17:44:20 * @LastEditTime: 2021-08-13 16:35:41
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
--> -->
<template> <template>
<div id="rkzjfx"> <div id="zdqsnxxfx" v-loading="loading">
<PersonEcharts :chartsProps="chartsProps"></PersonEcharts> <PersonEcharts
:chartsProps="chartsProps"
:chartsData="chartsData"
></PersonEcharts>
</div> </div>
</template> </template>
<script> <script>
import PersonEcharts from "@c/Person_Echarts.vue"; import PersonEcharts from "@c/Person_Echarts.vue";
import { zdqsn } from "@/api/ywxtdd";
import { code } from "@/assets/jsData/tjfx_code.js";
export default { export default {
data() { data() {
return { return {
loading: false,
loadingNumber: 0,
chartsProps: [ chartsProps: [
{ {
ref: "dqfb", ref: "dqfb",
...@@ -53,13 +60,120 @@ export default { ...@@ -53,13 +60,120 @@ export default {
col: "3", col: "3",
}, },
], ],
chartsData: [
{
res: "zdqsnjy",
code: "asjdj",
type: "pie",
data: [
{
name: "闲散青少年",
value: "4",
},
{
name: "农村留守儿童",
value: "12",
},
{
name: "服刑人员未成年子女",
value: "3",
},
{
name: "流浪乞讨未成年人",
value: "2",
},
],
},
{
res: "dqfb",
params: {
lx: "1",
},
type: "bar",
data: [],
},
{
res: "xqbl",
params: {
lx: "2",
},
type: "pie",
code: "xbbl",
data: [],
},
{
res: "nlcc",
params: {
lx: "3",
},
type: "pie",
data: [],
},
{
res: "whcd",
params: {
lx: "4",
},
code: "whcd",
type: "pie",
data: [],
},
{
res: "lxfb",
params: {
lx: "5",
},
type: "pie",
code: "zdqsnlx",
data: [],
},
{
res: "bfqk",
params: {
lx: "7",
},
type: "bar",
data: [],
},
],
}; };
}, },
components: { methods: {
PersonEcharts, getChartsData() {
this.chartsData.forEach((i, index) => {
if (i.data.length <= 0) {
this.loadingNumber++;
zdqsn(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
}
});
},
},
watch: {
loadingNumber(val) {
if (val != 0) {
this.loading = true;
} else {
this.loading = false;
}
},
}, },
mounted() { mounted() {
// console.log(this.$refs["syfwqyfb"][0]); this.getChartsData();
},
components: {
PersonEcharts,
}, },
}; };
</script> </script>
src/views/tjfx/zdsjyjfx.vue
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-08-10 16:05:23 * @Date: 2021-08-10 16:05:23
* @LastEditTime: 2021-08-10 17:40:39 * @LastEditTime: 2021-08-13 16:37:57
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue * @FilePath: \founder_vue\src\views\tjfx\rkzjfx.vue
--> -->
<template> <template>
<div id="rkzjfx"> <div id="zdsjyjfx" v-loading="loading">
<PersonEcharts :chartsProps="chartsProps"></PersonEcharts> <PersonEcharts
:chartsProps="chartsProps"
:chartsData="chartsData"
></PersonEcharts>
</div> </div>
</template> </template>
<script> <script>
import PersonEcharts from "@c/Person_Echarts.vue"; import PersonEcharts from "@c/Person_Echarts.vue";
import { zdsj } from "@/api/ywxtdd";
import { code } from "@/assets/jsData/tjfx_code.js";
export default { export default {
data() { data() {
return { return {
loading: false,
loadingNumber: 0,
chartsProps: [ chartsProps: [
{ {
ref: "rkqsfx", ref: "qtxsj",
title: "人口趋势分析", title: "群体性事件",
col: "3", col: "3",
}, },
{ {
ref: "czrkqyfb", ref: "asj",
title: "常住人口区域分布", title: "案事件",
col: "3", col: "3",
}, },
{ {
ref: "ldrkqyfb", ref: "yqdt",
title: "流动人口区域分布", title: "舆情动态",
col: "3", col: "3",
}, },
],
chartsData: [
{ {
ref: "wlhrkqyfb", res: "asj",
title: "未落户人口区域分布", params: {
col: "3", lx: "2",
},
code: "asjdj",
type: "pie",
data: [],
}, },
{ {
ref: "syfwqyfb", res: "qtxsj",
title: "实有房屋区域分布", code: "asjdj",
col: "3", type: "pie",
data: [
{
name: "一般",
value: "4",
},
{
name: "特别重大",
value: "1",
},
{
name: "重大",
value: "3",
},
{
name: "较大",
value: "2",
},
],
},
{
res: "yqdt",
code: "asjdj",
type: "pie",
data: [
{
name: "一般",
value: "2",
},
{
name: "特别重大",
value: "4",
},
{
name: "重大",
value: "4",
},
{
name: "较大",
value: "2",
},
],
}, },
], ],
}; };
...@@ -48,8 +102,39 @@ export default { ...@@ -48,8 +102,39 @@ export default {
components: { components: {
PersonEcharts, PersonEcharts,
}, },
methods: {
getChartsData() {
this.chartsData.forEach((i, index) => {
if (i.data.length <= 0) {
this.loadingNumber++;
zdsj(i.params).then((res) => {
this.loadingNumber--;
let data = res.data;
if (i.code) {
data = data.map((item) => {
return {
name: code[i.code][item.name],
value: item.value,
};
});
}
this.$set(this.chartsData[index], "data", data);
});
}
});
},
},
watch: {
loadingNumber(val) {
if (val != 0) {
this.loading = true;
} else {
this.loading = false;
}
},
},
mounted() { mounted() {
// console.log(this.$refs["syfwqyfb"][0]); this.getChartsData();
}, },
}; };
</script> </script>
vue.config.js
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-07-28 09:13:40 * @Date: 2021-07-28 09:13:40
* @LastEditTime: 2021-08-11 18:00:58 * @LastEditTime: 2021-08-13 10:47:06
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \山南\vue.config.js * @FilePath: \山南\vue.config.js
...@@ -66,17 +66,17 @@ module.exports = { ...@@ -66,17 +66,17 @@ module.exports = {
} }
}, },
"/OTHER": { "/OTHER": {
target: "http://172.18.110.13:8085", target: "http://172.18.110.13:8085",
ws: true, ws: true,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
'^/OTHER': '/OTHER' '^/OTHER': '/OTHER'
} }
}, },
}, },
}, },
css: { css: {
sourceMap: process.env.NODE_ENV === "development" ?true:false // 在开发环境下开启 CSS sourcemaps sourceMap: process.env.NODE_ENV === "development" ? true : false // 在开发环境下开启 CSS sourcemaps
} }
}; };
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