政务大屏数据处理。
This commit is contained in:
parent
92cf909ee6
commit
74aa210c5f
@ -55,6 +55,7 @@ const props = defineProps({
|
|||||||
default() {
|
default() {
|
||||||
return [
|
return [
|
||||||
// { label: '首页', value: '/new-digital-agriculture-screen/v2/home' },
|
// { label: '首页', value: '/new-digital-agriculture-screen/v2/home' },
|
||||||
|
{ label: '首页', value: 'home' },
|
||||||
{ label: '土地资源', value: '/new-digital-agriculture-screen/v2/land' },
|
{ label: '土地资源', value: '/new-digital-agriculture-screen/v2/land' },
|
||||||
{ label: '投入品监管', value: '/new-digital-agriculture-screen/v2/inputs' },
|
{ label: '投入品监管', value: '/new-digital-agriculture-screen/v2/inputs' },
|
||||||
{ label: '产出品管理', value: '/new-digital-agriculture-screen/v2/entities' },
|
{ label: '产出品管理', value: '/new-digital-agriculture-screen/v2/entities' },
|
||||||
@ -120,6 +121,10 @@ function handleTitleBtn(t = -1) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
function handleTitleClick(val) {
|
function handleTitleClick(val) {
|
||||||
|
if (val === 'home') {
|
||||||
|
window.location.href = 'http://47.109.205.240/platform';
|
||||||
|
return;
|
||||||
|
}
|
||||||
activeTitle.value = val;
|
activeTitle.value = val;
|
||||||
// emit('changeTitle', val);
|
// emit('changeTitle', val);
|
||||||
router.push({ path: val });
|
router.push({ path: val });
|
||||||
|
@ -27,9 +27,9 @@ const chartData = ref(
|
|||||||
|
|
||||||
// 各品类基础值
|
// 各品类基础值
|
||||||
return [
|
return [
|
||||||
{ type: '种子种苗', values: generateWaveData(15) },
|
{ type: '种子', values: generateWaveData(1) },
|
||||||
{ type: '化肥', values: generateWaveData(20) },
|
{ type: '化肥', values: generateWaveData(20) },
|
||||||
{ type: '农药', values: generateWaveData(10) },
|
{ type: '农药', values: generateWaveData(2) },
|
||||||
].flatMap(({ type, values }) =>
|
].flatMap(({ type, values }) =>
|
||||||
values.map((value, i) => ({
|
values.map((value, i) => ({
|
||||||
type,
|
type,
|
||||||
@ -50,7 +50,7 @@ function hexToRGBA(hex, alpha = 1) {
|
|||||||
const chartOption = ref({
|
const chartOption = ref({
|
||||||
color: ['#02FD94', '#FEF906', '#01FEFD'],
|
color: ['#02FD94', '#FEF906', '#01FEFD'],
|
||||||
legend: {
|
legend: {
|
||||||
data: ['种子种苗', '化肥', '农药'],
|
data: ['种子', '化肥', '农药'],
|
||||||
top: 8,
|
top: 8,
|
||||||
itemWidth: 12, // 矩形宽度
|
itemWidth: 12, // 矩形宽度
|
||||||
itemHeight: 12, // 矩形高度
|
itemHeight: 12, // 矩形高度
|
||||||
@ -104,7 +104,7 @@ const chartOption = ref({
|
|||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '种子种苗',
|
name: '种子',
|
||||||
type: 'line',
|
type: 'line',
|
||||||
smooth: true,
|
smooth: true,
|
||||||
symbol: 'none',
|
symbol: 'none',
|
||||||
|
@ -1,12 +1,20 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="order-stats">
|
<div class="order-stats">
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
<el-col v-for="item in state.list" :key="item.label" :span="12">
|
<el-col :span="12">
|
||||||
<div class="order-stats-item flex-column">
|
<div class="order-stats-item flex-column">
|
||||||
<div class="order-stats-value">
|
<div class="order-stats-value">
|
||||||
{{ item.value }}<span>{{ item.unit }}</span>
|
{{ currentChoose[0].value }}<span>{{ currentChoose[0].unit }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="order-stats-label">{{ item.label }}</div>
|
<div class="order-stats-label">{{ currentChoose[0].label }}</div>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<div class="order-stats-item flex-column">
|
||||||
|
<div class="order-stats-value">
|
||||||
|
{{ currentChoose[1].value }}<span>{{ currentChoose[1].unit }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="order-stats-label">{{ currentChoose[1].label }}</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
@ -14,10 +22,18 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive } from 'vue';
|
import { reactive, onMounted, watch, ref } from 'vue';
|
||||||
|
import { isEmpty } from '@/utils/index.js';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
data: {
|
||||||
|
type: String,
|
||||||
|
default: () => '3',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
list: [
|
year: [
|
||||||
{
|
{
|
||||||
label: '订单金额',
|
label: '订单金额',
|
||||||
value: '548.86',
|
value: '548.86',
|
||||||
@ -29,7 +45,66 @@ const state = reactive({
|
|||||||
unit: '笔',
|
unit: '笔',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
day: [
|
||||||
|
{
|
||||||
|
label: '订单金额',
|
||||||
|
value: '0.95',
|
||||||
|
unit: '万元',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '订单数量',
|
||||||
|
value: '583',
|
||||||
|
unit: '笔',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
month: [
|
||||||
|
{
|
||||||
|
label: '订单金额',
|
||||||
|
value: '34.85',
|
||||||
|
unit: '万元',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '订单数量',
|
||||||
|
value: '16517',
|
||||||
|
unit: '笔',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
quarter: [
|
||||||
|
{
|
||||||
|
label: '订单金额',
|
||||||
|
value: '117.51',
|
||||||
|
unit: '万元',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '订单数量',
|
||||||
|
value: '46120',
|
||||||
|
unit: '笔',
|
||||||
|
},
|
||||||
|
],
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const currentChoose = ref(state.year);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.data,
|
||||||
|
(val) => {
|
||||||
|
if (!isEmpty(val)) {
|
||||||
|
if (val === '3') {
|
||||||
|
currentChoose.value = state.year;
|
||||||
|
} else if (val === '2') {
|
||||||
|
currentChoose.value = state.quarter;
|
||||||
|
} else if (val === '1') {
|
||||||
|
currentChoose.value = state.month;
|
||||||
|
} else if (val === '0') {
|
||||||
|
currentChoose.value = state.day;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
deep: true,
|
||||||
|
immediate: true,
|
||||||
|
}
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
@ -3,7 +3,7 @@
|
|||||||
<template #header>
|
<template #header>
|
||||||
<div class="land-map-pop-header">
|
<div class="land-map-pop-header">
|
||||||
<div class="title">{{ currentRegion?.name || '投入品' }}</div>
|
<div class="title">{{ currentRegion?.name || '投入品' }}</div>
|
||||||
<a class="view-case" @click.prevent="handleViewCase">查看案件 ></a>
|
<!-- <a class="view-case" @click.prevent="handleViewCase">查看案件 ></a>-->
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #dialogContent>
|
<template #dialogContent>
|
||||||
|
@ -83,8 +83,8 @@ const state = reactive({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
data: [
|
data: [
|
||||||
{ value: 221.8, name: '产业运营平台' },
|
{ value: 221.8, name: '合资公司' },
|
||||||
{ value: 70.01, name: '其它', floatZ: 1 },
|
{ value: 70.01, name: '其它实体', floatZ: 1 },
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -40,11 +40,12 @@ const chartConfig = ref({
|
|||||||
option: {
|
option: {
|
||||||
header: ['投入品种类', '平台价格', '市场价格'],
|
header: ['投入品种类', '平台价格', '市场价格'],
|
||||||
dataset: [
|
dataset: [
|
||||||
['圆茄种苗', '0.3元/棵', '0.4元/棵'],
|
['西红柿种苗', '0.45元/株', '0.6元/株'],
|
||||||
['高氮复合肥', '1850元/吨', '1980元/吨'],
|
['美玉27号甜糯玉米种子', '102元/kg', '126元/kg'],
|
||||||
['硫酸钾', '1250元/吨', '1380元/吨'],
|
['磷酸二氢钾99% 全水溶叶面肥磷钾肥', '6750元/吨', '8400元/吨'],
|
||||||
['高氮复合肥', '1850元/吨', '1980元/吨'],
|
['大量元素水溶肥 平衡,高钾,高氮', '6550元/吨', '7980元/吨'],
|
||||||
['西红柿种苗', '0.3元/棵', '0.4元/棵'],
|
['20%氯虫苯甲酰胺', '69885元/吨', '76880元/吨'],
|
||||||
|
['21.9%精草铵膦铵盐高浓度除草剂', '2748元/吨', '3416元/吨'],
|
||||||
],
|
],
|
||||||
// 样式配置
|
// 样式配置
|
||||||
headerBGC: 'rgba(53, 208, 192, 0.4)', // 表头背景
|
headerBGC: 'rgba(53, 208, 192, 0.4)', // 表头背景
|
||||||
|
@ -6,34 +6,34 @@
|
|||||||
import { reactive } from 'vue';
|
import { reactive } from 'vue';
|
||||||
|
|
||||||
const rawData = [
|
const rawData = [
|
||||||
{ name: '勐撒镇', type: '种子农药', value: 15 },
|
{ name: '勐撒镇', type: '种子', value: 0.15 },
|
||||||
{ name: '勐撒镇', type: '化肥', value: 30 },
|
{ name: '勐撒镇', type: '化肥', value: 3.0 },
|
||||||
{ name: '勐撒镇', type: '农药', value: 22 },
|
{ name: '勐撒镇', type: '农药', value: 2.2 },
|
||||||
{ name: '勐永镇', type: '种子农药', value: 18 },
|
{ name: '勐永镇', type: '种子', value: 0.18 },
|
||||||
{ name: '勐永镇', type: '化肥', value: 28 },
|
{ name: '勐永镇', type: '化肥', value: 2.8 },
|
||||||
{ name: '勐永镇', type: '农药', value: 20 },
|
{ name: '勐永镇', type: '农药', value: 2.0 },
|
||||||
{ name: '孟定镇', type: '种子农药', value: 21 },
|
{ name: '孟定镇', type: '种子', value: 0.21 },
|
||||||
{ name: '孟定镇', type: '化肥', value: 25 },
|
{ name: '孟定镇', type: '化肥', value: 2.5 },
|
||||||
{ name: '孟定镇', type: '农药', value: 24 },
|
{ name: '孟定镇', type: '农药', value: 2.4 },
|
||||||
{ name: '勐简乡', type: '种子农药', value: 13 },
|
{ name: '勐简乡', type: '种子', value: 0.13 },
|
||||||
{ name: '勐简乡', type: '化肥', value: 20 },
|
{ name: '勐简乡', type: '化肥', value: 2.0 },
|
||||||
{ name: '勐简乡', type: '农药', value: 15 },
|
{ name: '勐简乡', type: '农药', value: 1.5 },
|
||||||
{ name: '贺派乡', type: '种子农药', value: 17 },
|
{ name: '贺派乡', type: '种子', value: 0.17 },
|
||||||
{ name: '贺派乡', type: '化肥', value: 18 },
|
{ name: '贺派乡', type: '化肥', value: 1.8 },
|
||||||
{ name: '贺派乡', type: '农药', value: 16 },
|
{ name: '贺派乡', type: '农药', value: 1.6 },
|
||||||
{ name: '芒洪乡', type: '种子农药', value: 14 },
|
{ name: '芒洪乡', type: '种子', value: 0.14 },
|
||||||
{ name: '芒洪乡', type: '化肥', value: 23 },
|
{ name: '芒洪乡', type: '化肥', value: 2.3 },
|
||||||
{ name: '芒洪乡', type: '农药', value: 21 },
|
{ name: '芒洪乡', type: '农药', value: 2.1 },
|
||||||
{ name: '大兴乡', type: '种子农药', value: 12 },
|
{ name: '大兴乡', type: '种子', value: 0.2 },
|
||||||
{ name: '大兴乡', type: '化肥', value: 17 },
|
{ name: '大兴乡', type: '化肥', value: 3 },
|
||||||
{ name: '大兴乡', type: '农药', value: 14 },
|
{ name: '大兴乡', type: '农药', value: 1.14 },
|
||||||
{ name: '耿马镇', type: '种子农药', value: 19 },
|
{ name: '耿马镇', type: '种子', value: 0.5 },
|
||||||
{ name: '耿马镇', type: '化肥', value: 26 },
|
{ name: '耿马镇', type: '化肥', value: 4 },
|
||||||
{ name: '耿马镇', type: '农药', value: 23 },
|
{ name: '耿马镇', type: '农药', value: 2.3 },
|
||||||
];
|
];
|
||||||
|
|
||||||
const towns = ['勐撒镇', '勐永镇', '孟定镇', '勐简乡', '贺派乡', '芒洪乡', '大兴乡', '耿马镇'];
|
const towns = ['勐撒镇', '勐永镇', '孟定镇', '勐简乡', '贺派乡', '芒洪乡', '大兴乡', '耿马镇'];
|
||||||
const types = ['种子农药', '化肥', '农药'];
|
const types = ['种子', '化肥', '农药'];
|
||||||
const colors = ['#15EB90', '#F3F70F', '#08DFE4'];
|
const colors = ['#15EB90', '#F3F70F', '#08DFE4'];
|
||||||
|
|
||||||
const series = types.map((type, idx) => {
|
const series = types.map((type, idx) => {
|
||||||
|
@ -51,13 +51,13 @@
|
|||||||
:value-field="'value'"
|
:value-field="'value'"
|
||||||
:down-width="'100px'"
|
:down-width="'100px'"
|
||||||
:options="[
|
:options="[
|
||||||
{ label: '按日', value: '0' },
|
|
||||||
{ label: '按月', value: '1' },
|
|
||||||
{ label: '按季度', value: '2' },
|
|
||||||
{ label: '按年', value: '3' },
|
{ label: '按年', value: '3' },
|
||||||
|
{ label: '按季度', value: '2' },
|
||||||
|
{ label: '按月', value: '1' },
|
||||||
|
{ label: '按日', value: '0' },
|
||||||
]"
|
]"
|
||||||
:is-down="true"
|
:is-down="true"
|
||||||
command="handleCommand"
|
@command="handleCommand"
|
||||||
>
|
>
|
||||||
<template #back>
|
<template #back>
|
||||||
<inputsFour :data="state.data.ProductEntity" />
|
<inputsFour :data="state.data.ProductEntity" />
|
||||||
@ -135,7 +135,7 @@ const loadData = async () => {
|
|||||||
unit: '家',
|
unit: '家',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
InputDetector: [{ JCFGL: 33.33, JCYPPC: 15684, zero_count: 13, JCHGL: 86.67, counts: 45 }],
|
InputDetector: [{ JCFGL: 49.58, JCYPPC: 15684, zero_count: 13, JCHGL: 86.67, counts: 45 }],
|
||||||
there: [
|
there: [
|
||||||
{ value: 530, name: '种子' },
|
{ value: 530, name: '种子' },
|
||||||
{ value: 1215, name: '化肥' },
|
{ value: 1215, name: '化肥' },
|
||||||
@ -143,11 +143,7 @@ const loadData = async () => {
|
|||||||
{ value: 916, name: '地膜' },
|
{ value: 916, name: '地膜' },
|
||||||
{ value: 108, name: '水' },
|
{ value: 108, name: '水' },
|
||||||
],
|
],
|
||||||
ProductEntity: [
|
ProductEntity: '3',
|
||||||
{ manufacturerCount: 2, percentage: 16.67, category: '种源企业' },
|
|
||||||
{ manufacturerCount: 5, percentage: 41.67, category: '农药厂家' },
|
|
||||||
{ manufacturerCount: 5, percentage: 41.67, category: '肥料厂家' },
|
|
||||||
],
|
|
||||||
five: [
|
five: [
|
||||||
{ value: 10, name: '2020' },
|
{ value: 10, name: '2020' },
|
||||||
{ value: 66, name: '2021' },
|
{ value: 66, name: '2021' },
|
||||||
@ -365,7 +361,8 @@ const loadData = async () => {
|
|||||||
loadData();
|
loadData();
|
||||||
|
|
||||||
const handleCommand = (data) => {
|
const handleCommand = (data) => {
|
||||||
state.queryCode = data.value;
|
console.log(data);
|
||||||
|
state.data.ProductEntity = data.value;
|
||||||
// console.info('data=', data);
|
// console.info('data=', data);
|
||||||
// nextTick(() => {
|
// nextTick(() => {
|
||||||
// fiveRef.value && fiveRef.value.refresData();
|
// fiveRef.value && fiveRef.value.refresData();
|
||||||
|
@ -27,12 +27,14 @@ import { ref, reactive, computed } from 'vue';
|
|||||||
|
|
||||||
const unit = ref('万亩');
|
const unit = ref('万亩');
|
||||||
const list = reactive([
|
const list = reactive([
|
||||||
{ title: '望天田', value: '60.8', color: '#01FEFD' },
|
{ title: '水田', value: '60.8', color: '#01FEFD' },
|
||||||
{ title: '菜地', value: '60.8', color: '#FEF906' },
|
{ title: '旱地', value: '60.8', color: '#FEF906' },
|
||||||
{ title: '水浇地', value: '60.8', color: '#02FD94' },
|
{ title: '水浇地', value: '60.8', color: '#02FD94' },
|
||||||
{ title: '果园', value: '60.8', color: '#FE7F03' },
|
{ title: '灌木林地', value: '60.8', color: '#FE7F03' },
|
||||||
{ title: '灌溉水田', value: '60.8', color: '#41BDFC' },
|
{ title: '竹林地', value: '60.8', color: '#41BDFC' },
|
||||||
{ title: '旱地', value: '60.8', color: '#FC0003' },
|
{ title: '果园', value: '60.8', color: '#FC0003' },
|
||||||
|
{ title: '茶园', value: '60.8', color: '#9C27B0' },
|
||||||
|
{ title: '人工牧草地', value: '60.8', color: '#4CAF50' },
|
||||||
]);
|
]);
|
||||||
function doMapclick() {
|
function doMapclick() {
|
||||||
list.forEach((v) => {
|
list.forEach((v) => {
|
||||||
|
@ -31,24 +31,25 @@
|
|||||||
<div class="right-charts-item">
|
<div class="right-charts-item">
|
||||||
<customBack
|
<customBack
|
||||||
top-title="管理需求分类"
|
top-title="管理需求分类"
|
||||||
:down-title="'永久基本农田'"
|
:down-title="'所有类型'"
|
||||||
:top-postion="'right'"
|
:top-postion="'right'"
|
||||||
:down-width="'140px'"
|
:down-width="'140px'"
|
||||||
:options="[
|
:options="[
|
||||||
{ label: '永久基本农田', value: '530926' },
|
{ label: '所有类型', value: '530926' },
|
||||||
{ label: '耿马镇', value: '42611' },
|
{ label: '水田', value: '42611' },
|
||||||
{ label: '勐撒镇', value: '9259' },
|
{ label: '灌溉水田', value: '9259' },
|
||||||
{ label: '勐永镇', value: '17787' },
|
{ label: '水浇地', value: '17787' },
|
||||||
{ label: '孟定镇', value: '42610' },
|
{ label: '灌木林地', value: '42610' },
|
||||||
{ label: '勐简乡', value: '17788' },
|
{ label: '竹林地', value: '17788' },
|
||||||
{ label: '贺派乡', value: '40161' },
|
{ label: '果园', value: '40161' },
|
||||||
{ label: '四排山乡', value: '40163' },
|
{ label: '茶园', value: '40163' },
|
||||||
{ label: '大兴乡', value: '40159' },
|
{ label: '人工牧草地', value: '40159' },
|
||||||
]"
|
]"
|
||||||
:is-down="true"
|
:is-down="true"
|
||||||
|
@command="handleContrast"
|
||||||
>
|
>
|
||||||
<template #back>
|
<template #back>
|
||||||
<landFive :data="state.data.five" />
|
<land-five :data="state.data.five"></land-five>
|
||||||
</template>
|
</template>
|
||||||
</customBack>
|
</customBack>
|
||||||
</div>
|
</div>
|
||||||
@ -64,7 +65,7 @@
|
|||||||
</el-row>
|
</el-row>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { nextTick, reactive } from 'vue';
|
import { nextTick, reactive, onMounted } from 'vue';
|
||||||
import landMap from './components/landMap.vue';
|
import landMap from './components/landMap.vue';
|
||||||
import landOne from './components/landOne.vue';
|
import landOne from './components/landOne.vue';
|
||||||
import landTwo from './components/landTwo.vue';
|
import landTwo from './components/landTwo.vue';
|
||||||
@ -84,6 +85,153 @@ const state = reactive({
|
|||||||
queryCode: '',
|
queryCode: '',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const landData = [
|
||||||
|
{
|
||||||
|
area: '耿马镇',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 15.2 },
|
||||||
|
{ type: '菜地', value: 12.5 },
|
||||||
|
{ type: '水浇地', value: 8.3 },
|
||||||
|
{ type: '果园', value: 5.1 },
|
||||||
|
{ type: '灌溉水田', value: 10.8 },
|
||||||
|
{ type: '旱地', value: 28.6 },
|
||||||
|
{ type: '竹林地', value: 1.2 },
|
||||||
|
{ type: '茶园', value: 0.8 },
|
||||||
|
{ type: '人工牧草地', value: 0.5 },
|
||||||
|
{ type: '灌木林地', value: 6.7 },
|
||||||
|
],
|
||||||
|
total: 89.7, // 15.2 + 12.5 + 8.3 + 5.1 + 10.8 + 28.6 + 1.2 + 0.8 + 0.5 + 6.7
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '勐永镇',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 8.5 },
|
||||||
|
{ type: '菜地', value: 9.2 },
|
||||||
|
{ type: '水浇地', value: 6.7 },
|
||||||
|
{ type: '果园', value: 4.3 },
|
||||||
|
{ type: '灌溉水田', value: 7.9 },
|
||||||
|
{ type: '旱地', value: 22.4 },
|
||||||
|
{ type: '竹林地', value: 0.9 },
|
||||||
|
{ type: '茶园', value: 0.6 },
|
||||||
|
{ type: '人工牧草地', value: 0.3 },
|
||||||
|
{ type: '灌木林地', value: 5.2 },
|
||||||
|
],
|
||||||
|
total: 66.0, // 8.5 + 9.2 + 6.7 + 4.3 + 7.9 + 22.4 + 0.9 + 0.6 + 0.3 + 5.2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '勐撒镇',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 12.1 },
|
||||||
|
{ type: '菜地', value: 15.3 },
|
||||||
|
{ type: '水浇地', value: 10.2 },
|
||||||
|
{ type: '果园', value: 7.8 },
|
||||||
|
{ type: '灌溉水田', value: 14.5 },
|
||||||
|
{ type: '旱地', value: 18.9 },
|
||||||
|
{ type: '竹林地', value: 1.5 },
|
||||||
|
{ type: '茶园', value: 1.2 },
|
||||||
|
{ type: '人工牧草地', value: 0.7 },
|
||||||
|
{ type: '灌木林地', value: 8.4 },
|
||||||
|
],
|
||||||
|
total: 91.6, // 12.1 + 15.3 + 10.2 + 7.8 + 14.5 + 18.9 + 1.5 + 1.2 + 0.7 + 8.4
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '孟定镇',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 5.8 },
|
||||||
|
{ type: '菜地', value: 7.0 },
|
||||||
|
{ type: '水浇地', value: 4.5 },
|
||||||
|
{ type: '果园', value: 3.2 },
|
||||||
|
{ type: '灌溉水田', value: 6.7 },
|
||||||
|
{ type: '旱地', value: 12.3 },
|
||||||
|
{ type: '竹林地', value: 0.7 },
|
||||||
|
{ type: '茶园', value: 0.4 },
|
||||||
|
{ type: '人工牧草地', value: 0.2 },
|
||||||
|
{ type: '灌木林地', value: 3.9 },
|
||||||
|
],
|
||||||
|
total: 44.7, // 5.8 + 7.0 + 4.5 + 3.2 + 6.7 + 12.3 + 0.7 + 0.4 + 0.2 + 3.9
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '大兴乡',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 6.3 },
|
||||||
|
{ type: '菜地', value: 8.1 },
|
||||||
|
{ type: '水浇地', value: 5.4 },
|
||||||
|
{ type: '果园', value: 3.9 },
|
||||||
|
{ type: '灌溉水田', value: 7.2 },
|
||||||
|
{ type: '旱地', value: 15.6 },
|
||||||
|
{ type: '竹林地', value: 1.1 },
|
||||||
|
{ type: '茶园', value: 0.9 },
|
||||||
|
{ type: '人工牧草地', value: 0.4 },
|
||||||
|
{ type: '灌木林地', value: 4.8 },
|
||||||
|
],
|
||||||
|
total: 53.7, // 6.3 + 8.1 + 5.4 + 3.9 + 7.2 + 15.6 + 1.1 + 0.9 + 0.4 + 4.8
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '芒洪乡',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 4.2 },
|
||||||
|
{ type: '菜地', value: 5.6 },
|
||||||
|
{ type: '水浇地', value: 3.8 },
|
||||||
|
{ type: '果园', value: 2.5 },
|
||||||
|
{ type: '灌溉水田', value: 5.1 },
|
||||||
|
{ type: '旱地', value: 11.5 },
|
||||||
|
{ type: '竹林地', value: 0.5 },
|
||||||
|
{ type: '茶园', value: 0.3 },
|
||||||
|
{ type: '人工牧草地', value: 0.1 },
|
||||||
|
{ type: '灌木林地', value: 3.2 },
|
||||||
|
],
|
||||||
|
total: 36.8, // 4.2 + 5.6 + 3.8 + 2.5 + 5.1 + 11.5 + 0.5 + 0.3 + 0.1 + 3.2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '四排山乡',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 3.7 },
|
||||||
|
{ type: '菜地', value: 4.8 },
|
||||||
|
{ type: '水浇地', value: 3.2 },
|
||||||
|
{ type: '果园', value: 2.1 },
|
||||||
|
{ type: '灌溉水田', value: 4.6 },
|
||||||
|
{ type: '旱地', value: 9.8 },
|
||||||
|
{ type: '竹林地', value: 0.4 },
|
||||||
|
{ type: '茶园', value: 0.2 },
|
||||||
|
{ type: '人工牧草地', value: 0.1 },
|
||||||
|
{ type: '灌木林地', value: 2.7 },
|
||||||
|
],
|
||||||
|
total: 31.6, // 3.7 + 4.8 + 3.2 + 2.1 + 4.6 + 9.8 + 0.4 + 0.2 + 0.1 + 2.7
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '贺派乡',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 7.9 },
|
||||||
|
{ type: '菜地', value: 10.4 },
|
||||||
|
{ type: '水浇地', value: 7.1 },
|
||||||
|
{ type: '果园', value: 5.6 },
|
||||||
|
{ type: '灌溉水田', value: 9.3 },
|
||||||
|
{ type: '旱地', value: 20.1 },
|
||||||
|
{ type: '竹林地', value: 1.3 },
|
||||||
|
{ type: '茶园', value: 1 },
|
||||||
|
{ type: '人工牧草地', value: 0.6 },
|
||||||
|
{ type: '灌木林地', value: 7.1 },
|
||||||
|
],
|
||||||
|
total: 70.4, // 7.9 + 10.4 + 7.1 + 5.6 + 9.3 + 20.1 + 1.3 + 1 + 0.6 + 7.1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
area: '勐简乡',
|
||||||
|
land: [
|
||||||
|
{ type: '水田', value: 5.1 },
|
||||||
|
{ type: '菜地', value: 6.7 },
|
||||||
|
{ type: '水浇地', value: 4.6 },
|
||||||
|
{ type: '果园', value: 3.4 },
|
||||||
|
{ type: '灌溉水田', value: 6.2 },
|
||||||
|
{ type: '旱地', value: 13.8 },
|
||||||
|
{ type: '竹林地', value: 0.8 },
|
||||||
|
{ type: '茶园', value: 0.5 },
|
||||||
|
{ type: '人工牧草地', value: 0.3 },
|
||||||
|
{ type: '灌木林地', value: 4.3 },
|
||||||
|
],
|
||||||
|
total: 45.7, // 5.1 + 6.7 + 4.6 + 3.4 + 6.2 + 13.8 + 0.8 + 0.5 + 0.3 + 4.3
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
// 加载
|
// 加载
|
||||||
const loadData = async () => {
|
const loadData = async () => {
|
||||||
state.loading = true;
|
state.loading = true;
|
||||||
@ -130,27 +278,27 @@ const loadData = async () => {
|
|||||||
],
|
],
|
||||||
four: [
|
four: [
|
||||||
{ value: 58.9, label: '灌溉水田' },
|
{ value: 58.9, label: '灌溉水田' },
|
||||||
{ value: 56.1, label: '基地地' },
|
{ value: 56.1, label: '基地' },
|
||||||
{ value: 60.8, label: '望天田' },
|
{ value: 60.8, label: '水田' },
|
||||||
{ value: 60.6, label: '水浇地' },
|
{ value: 60.6, label: '水浇地' },
|
||||||
{ value: 32.6, label: '林地' },
|
{ value: 32.6, label: '竹林地' },
|
||||||
{ value: 25.8, label: '育苗地' },
|
{ value: 25.8, label: '育苗地' },
|
||||||
{ value: 56.0, label: '果园' },
|
{ value: 56.0, label: '果园' },
|
||||||
{ value: 52.4, label: '草地' },
|
{ value: 52.4, label: '草地' },
|
||||||
{ value: 6.3, label: '观测用地' },
|
{ value: 6.3, label: '观测用地' },
|
||||||
{ value: 6.1, label: '监测用地' },
|
{ value: 6.1, label: '监测用地' },
|
||||||
],
|
],
|
||||||
five: [
|
// five: [
|
||||||
{ value: 20, name: '耿马镇' },
|
// { value: 20, name: '耿马镇' },
|
||||||
{ value: 15, name: '勐撒镇' },
|
// { value: 15, name: '勐撒镇' },
|
||||||
{ value: 12, name: '勐永镇' },
|
// { value: 12, name: '勐永镇' },
|
||||||
{ value: 16, name: '孟定镇' },
|
// { value: 16, name: '孟定镇' },
|
||||||
{ value: 8, name: '勐简乡' },
|
// { value: 8, name: '勐简乡' },
|
||||||
{ value: 12, name: '贺派乡' },
|
// { value: 12, name: '贺派乡' },
|
||||||
{ value: 10, name: '四排山乡' },
|
// { value: 10, name: '四排山乡' },
|
||||||
{ value: 9, name: '芒洪乡' },
|
// { value: 9, name: '芒洪乡' },
|
||||||
{ value: 8, name: '大兴乡' },
|
// { value: 8, name: '大兴乡' },
|
||||||
],
|
// ],
|
||||||
six: [
|
six: [
|
||||||
{
|
{
|
||||||
name: '小麦',
|
name: '小麦',
|
||||||
@ -195,12 +343,37 @@ const loadData = async () => {
|
|||||||
|
|
||||||
loadData();
|
loadData();
|
||||||
|
|
||||||
const handleCommand = (data) => {
|
onMounted(() => {
|
||||||
state.queryCode = data.value;
|
state.data.five = [];
|
||||||
// console.info('data=', data);
|
for (let i in landData) {
|
||||||
// nextTick(() => {
|
state.data.five.push({ name: landData[i].area, value: landData[i].total });
|
||||||
// fiveRef.value && fiveRef.value.refresData();
|
}
|
||||||
// });
|
});
|
||||||
|
|
||||||
|
const handleContrast = (data) => {
|
||||||
|
state.data.five = [];
|
||||||
|
if (data.label === '所有类型') {
|
||||||
|
for (let i in landData) {
|
||||||
|
let obj = {
|
||||||
|
name: landData[i].area,
|
||||||
|
value: landData[i].total,
|
||||||
|
};
|
||||||
|
state.data.five.push(obj);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
for (let i in landData) {
|
||||||
|
let obj = {
|
||||||
|
name: landData[i].area,
|
||||||
|
value: 0,
|
||||||
|
};
|
||||||
|
for (let k in landData[i].land) {
|
||||||
|
if (landData[i].land[k].type === data.label) {
|
||||||
|
obj.value = landData[i].land[k].value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
state.data.five.push(obj);
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
@ -16,4 +16,12 @@ export function agriculturalList(params) {
|
|||||||
method: 'GET',
|
method: 'GET',
|
||||||
params,
|
params,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取用户评价列表
|
||||||
|
export function agriculturalContent(params) {
|
||||||
|
return request('goods/business/category/contentPage', {
|
||||||
|
method: 'POST',
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
@ -168,7 +168,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="tabVal == 'evaluate'" class="content-evaluate">
|
<div v-if="tabVal == 'evaluate'" class="content-evaluate">
|
||||||
<evaluate></evaluate>
|
<evaluate :good-id="goodId"></evaluate>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -188,6 +188,7 @@ import evaluate from './components/evaluate.vue';
|
|||||||
import { useRoute, useRouter } from 'vue-router';
|
import { useRoute, useRouter } from 'vue-router';
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
const goodId = route.params.id; // 获取参数
|
||||||
|
|
||||||
let bannerList = reactive(['images/ecommerce/' + 'banner.png', 'images/ecommerce/' + 'banner.png']);
|
let bannerList = reactive(['images/ecommerce/' + 'banner.png', 'images/ecommerce/' + 'banner.png']);
|
||||||
const tabList = reactive([
|
const tabList = reactive([
|
||||||
|
@ -81,10 +81,26 @@ import { isEmpty, getAssetsFile } from '@/utils';
|
|||||||
import { useRoute, useRouter } from 'vue-router';
|
import { useRoute, useRouter } from 'vue-router';
|
||||||
import { ref, reactive, onMounted, watch } from 'vue';
|
import { ref, reactive, onMounted, watch } from 'vue';
|
||||||
import upImg from '@/components/upImg.vue';
|
import upImg from '@/components/upImg.vue';
|
||||||
|
import { agriculturalContent } from '@/apis/agricultural.js';
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
let score = ref(4.5);
|
let score = ref(4.5);
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
goodId: {
|
||||||
|
type: Number,
|
||||||
|
default: () => 0,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const data = reactive({
|
||||||
|
type: 1,
|
||||||
|
current: 1,
|
||||||
|
size: 20,
|
||||||
|
goodId: 0,
|
||||||
|
});
|
||||||
|
|
||||||
const colors = ref(['#99A9BF', '#25BF82', '#25BF82']);
|
const colors = ref(['#99A9BF', '#25BF82', '#25BF82']);
|
||||||
const totalList = reactive([
|
const totalList = reactive([
|
||||||
{ title: '全部', name: 'all', num: 912 },
|
{ title: '全部', name: 'all', num: 912 },
|
||||||
@ -106,6 +122,19 @@ const doAnonymous = () => {
|
|||||||
isAnonymous.value = !isAnonymous.value;
|
isAnonymous.value = !isAnonymous.value;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
data.goodId = props.goodId;
|
||||||
|
getContentList();
|
||||||
|
});
|
||||||
|
|
||||||
|
const getContentList = (type) => {
|
||||||
|
agriculturalContent(data).then((res) => {
|
||||||
|
if (res.code === '200') {
|
||||||
|
console.log(res);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
const submitEvaluate = () => {};
|
const submitEvaluate = () => {};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user