feat:analysis-land
This commit is contained in:
parent
95bb9ab404
commit
7ef6e7c6e2
@ -3,7 +3,7 @@
|
||||
* @Author: zenghua.wang
|
||||
* @Date: 2023-06-20 11:48:41
|
||||
* @LastEditors: zenghua.wang
|
||||
* @LastEditTime: 2025-02-28 13:50:00
|
||||
* @LastEditTime: 2025-03-04 10:42:19
|
||||
*/
|
||||
import { createRouter, createWebHistory } from 'vue-router';
|
||||
import Layout from '@/layouts/index.vue';
|
||||
@ -12,7 +12,7 @@ import resourceRouter from './modules/resource';
|
||||
import plantingAndBreedingRouter from './modules/plantingAndBreeding';
|
||||
import landsRoutes from './modules/lands';
|
||||
import annualplanRoutes from './modules/annualplan';
|
||||
import statisticsRoutes from './modules/statistics';
|
||||
import statisticsRoutes from './modules/statisticAnalysis';
|
||||
import dictRoutes from './modules/dict';
|
||||
|
||||
export const constantRoutes = [
|
||||
|
||||
@ -0,0 +1,32 @@
|
||||
import Layout from '@/layouts/index.vue';
|
||||
import Views from '@/layouts/Views.vue';
|
||||
|
||||
export default [
|
||||
{
|
||||
path: '/sub-government-affairs-service/analysis',
|
||||
name: 'analysis',
|
||||
component: Layout,
|
||||
redirect: '/sub-government-affairs-service/analysis-land',
|
||||
meta: { title: '统计分析', icon: 'icon-test' },
|
||||
children: [
|
||||
{
|
||||
path: '/sub-government-affairs-service/analysis-land',
|
||||
component: () => import('@/views/statisticAnalysis/land/index.vue'),
|
||||
name: 'analysis-land',
|
||||
meta: { title: '土地利用与规划分析', icon: 'Document' },
|
||||
},
|
||||
// {
|
||||
// path: '/sub-government-affairs-service/analysis-agriculture',
|
||||
// name: 'analysis-agriculture',
|
||||
// component: () => import('@/views/statisticAnalysis/agriculture/index.vue'),
|
||||
// meta: { title: '农业生产效率分析', icon: 'Document' },
|
||||
// },
|
||||
// {
|
||||
// path: '/sub-government-affairs-service/analysis-environment',
|
||||
// name: 'analysis-environment',
|
||||
// component: () => import('@/views/statisticAnalysis/environment/index.vue'),
|
||||
// meta: { title: '环境影响与经济效益分析', icon: 'Document' },
|
||||
// },
|
||||
],
|
||||
},
|
||||
];
|
||||
@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<div class="analysis">
|
||||
<!-- <h3 class="analysis-title">土地利用与规划分析</h3> -->
|
||||
<el-row :gutter="16" style="margin-bottom: 10px">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-pie :chart-data="state.landData" height="460px" :option="state.landOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-bar :chart-data="state.cropData" height="460px" :option="state.cropOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="24">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-multi-line :chart-data="state.landTrendData" height="500px" :option="state.landTrendOption" type="line" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
|
||||
const state = reactive({
|
||||
landOption: {
|
||||
color: ['#3685fe', '#41b879', '#ffd500'],
|
||||
title: {
|
||||
text: '土地用途分析',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ['耕地', '林地', '建设用地'],
|
||||
},
|
||||
label: {
|
||||
color: '#333',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: [80, 140],
|
||||
roseType: 'area',
|
||||
itemStyle: {
|
||||
borderRadius: 20,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
landData: [
|
||||
{ value: 100, name: '耕地' },
|
||||
{ value: 105, name: '林地' },
|
||||
{ value: 217, name: '建设用地' },
|
||||
],
|
||||
cropOption: {
|
||||
title: {
|
||||
text: '作物种植结构',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['土豆', '西红柿', '玉米', '花生', '水稻'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '面积（亩）',
|
||||
// splitLine: {
|
||||
// show: false,
|
||||
// },
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'bar',
|
||||
type: 'bar',
|
||||
barWidth: 50,
|
||||
data: [],
|
||||
itemStyle: {
|
||||
borderRadius: 25,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
cropData: [
|
||||
{ value: 230, name: '土豆' },
|
||||
{ value: 165, name: '西红柿' },
|
||||
{ value: 217, name: '玉米' },
|
||||
{ value: 200, name: '花生' },
|
||||
{ value: 305, name: '水稻' },
|
||||
],
|
||||
landTrendOption: {
|
||||
color: ['#3685fe', '#41b879', '#ffd500'],
|
||||
title: {
|
||||
text: '土地变更趋势',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '年份',
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '面积（亩）',
|
||||
// splitLine: {
|
||||
// show: false,
|
||||
// },
|
||||
},
|
||||
},
|
||||
landTrendData: [
|
||||
{
|
||||
type: '耕地',
|
||||
value: 40,
|
||||
name: '2022',
|
||||
},
|
||||
{
|
||||
type: '林地',
|
||||
value: 146,
|
||||
name: '2022',
|
||||
},
|
||||
{
|
||||
type: '建设用地',
|
||||
value: 81,
|
||||
name: '2022',
|
||||
},
|
||||
{
|
||||
type: '耕地',
|
||||
value: 60,
|
||||
name: '2023',
|
||||
},
|
||||
{
|
||||
type: '林地',
|
||||
value: 186,
|
||||
name: '2023',
|
||||
},
|
||||
{
|
||||
type: '建设用地',
|
||||
value: 101,
|
||||
name: '2023',
|
||||
},
|
||||
{
|
||||
type: '耕地',
|
||||
value: 230,
|
||||
name: '2024',
|
||||
},
|
||||
{
|
||||
type: '林地',
|
||||
value: 256,
|
||||
name: '2024',
|
||||
},
|
||||
{
|
||||
type: '建设用地',
|
||||
value: 301,
|
||||
name: '2024',
|
||||
},
|
||||
{
|
||||
type: '耕地',
|
||||
value: 160,
|
||||
name: '2025',
|
||||
},
|
||||
{
|
||||
type: '林地',
|
||||
value: 286,
|
||||
name: '2025',
|
||||
},
|
||||
{
|
||||
type: '建设用地',
|
||||
value: 161,
|
||||
name: '2025',
|
||||
},
|
||||
],
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.analysis {
|
||||
&-title {
|
||||
font-size: 20px;
|
||||
color: #000;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user