Merge branch 'dev' of http://192.168.18.88:8077/sznyb/daimp-front into dev
This commit is contained in:
commit
b3d7b2453f
@ -209,9 +209,17 @@ export function savelandInspection(data) {
|
||||
});
|
||||
}
|
||||
|
||||
export function editlandInspection(data = {}) {
|
||||
return request('land-resource/landInspection/update', {
|
||||
export function enrolllandInspection(data = {}) {
|
||||
return request('land-resource/landInspection/registrationResult', {
|
||||
method: 'PUT',
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
export function exportlandInspection(params = {}) {
|
||||
return request('/land-resource/landInspection/export', {
|
||||
method: 'GET',
|
||||
params,
|
||||
responseType: 'blob',
|
||||
});
|
||||
}
|
||||
|
||||
@ -3,17 +3,16 @@
|
||||
* @Author: zenghua.wang
|
||||
* @Date: 2023-06-20 11:48:41
|
||||
* @LastEditors: zenghua.wang
|
||||
* @LastEditTime: 2025-03-04 10:42:19
|
||||
* @LastEditTime: 2025-03-06 16:11:29
|
||||
*/
|
||||
import { createRouter, createWebHistory } from 'vue-router';
|
||||
import Layout from '@/layouts/index.vue';
|
||||
|
||||
import resourceRouter from './modules/resource';
|
||||
import plantingAndBreedingRouter from './modules/plantingAndBreeding';
|
||||
import traceRouter from './modules/trace';
|
||||
import landsRoutes from './modules/lands';
|
||||
import annualplanRoutes from './modules/annualplan';
|
||||
import statisticsRoutes from './modules/statisticAnalysis';
|
||||
import dictRoutes from './modules/dict';
|
||||
import annualplanRoutes from './modules/annualplan';
|
||||
|
||||
export const constantRoutes = [
|
||||
{
|
||||
@ -44,10 +43,8 @@ export const constantRoutes = [
|
||||
],
|
||||
},
|
||||
...resourceRouter,
|
||||
...plantingAndBreedingRouter,
|
||||
...annualplanRoutes,
|
||||
...traceRouter,
|
||||
...landsRoutes,
|
||||
...statisticsRoutes,
|
||||
...dictRoutes,
|
||||
];
|
||||
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import Layout from '@/layouts/index.vue';
|
||||
import Views from '@/layouts/Views.vue';
|
||||
|
||||
const annualplanRoutes = [
|
||||
{
|
||||
path: '/sub-government-affairs-service/annualPlan',
|
||||
name: 'annualPlan',
|
||||
component: Layout,
|
||||
component: Views,
|
||||
redirect: '/sub-government-affairs-service/annualPlans',
|
||||
meta: { title: '年度计划', icon: 'Document' },
|
||||
children: [
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import Layout from '@/layouts/index.vue';
|
||||
import Views from '@/layouts/Views.vue';
|
||||
import annualplanRouters from './annualplan';
|
||||
import statisticsRoutes from './statisticAnalysis';
|
||||
|
||||
export default [
|
||||
{
|
||||
@ -15,12 +16,8 @@ export default [
|
||||
name: 'grid',
|
||||
meta: { title: '网格化管理', icon: 'Document' },
|
||||
},
|
||||
// {
|
||||
// path: '/annual-plan',
|
||||
// component: () => import('@/views/resource/plan/index.vue'),
|
||||
// name: 'annual-plan',
|
||||
// meta: { title: '年度计划', icon: 'Document' },
|
||||
// },
|
||||
...annualplanRouters,
|
||||
...statisticsRoutes,
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
@ -1,32 +1,31 @@
|
||||
import Layout from '@/layouts/index.vue';
|
||||
import Views from '@/layouts/Views.vue';
|
||||
|
||||
export default [
|
||||
{
|
||||
path: '/sub-government-affairs-service/analysis',
|
||||
name: 'analysis',
|
||||
component: Layout,
|
||||
component: Views,
|
||||
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'),
|
||||
component: () => import('@/views/resource/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' },
|
||||
// },
|
||||
{
|
||||
path: '/sub-government-affairs-service/analysis-agriculture',
|
||||
name: 'analysis-agriculture',
|
||||
component: () => import('@/views/resource/statisticAnalysis/agriculture/index.vue'),
|
||||
meta: { title: '农业生产效率分析', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/analysis-environment',
|
||||
name: 'analysis-environment',
|
||||
component: () => import('@/views/resource/statisticAnalysis/environment/index.vue'),
|
||||
meta: { title: '环境影响与经济效益分析', icon: 'Document' },
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
@ -1,32 +0,0 @@
|
||||
import Layout from '@/layouts/index.vue';
|
||||
|
||||
const statisticsRoutes = [
|
||||
{
|
||||
path: '/sub-government-affairs-service/statistics',
|
||||
name: 'statistics',
|
||||
component: Layout,
|
||||
redirect: '/sub-government-affairs-service/utilizePlan',
|
||||
meta: { title: '统计分析', icon: 'Document' },
|
||||
children: [
|
||||
{
|
||||
path: '/sub-government-affairs-service/utilizePlan',
|
||||
name: 'utilizePlan',
|
||||
component: () => import('@/views/statistics/component/utilizePlan/index.vue'),
|
||||
meta: { title: '土地利用与规划分析', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/agriculture',
|
||||
name: 'agriculture',
|
||||
component: () => import('@/views/statistics/component/agriculture/index.vue'),
|
||||
meta: { title: '农业生产效率分析', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/environment',
|
||||
name: 'environment',
|
||||
component: () => import('@/views/statistics/component/environment/index.vue'),
|
||||
meta: { title: '环境影响与经济效益分析', icon: 'Document' },
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
export default statisticsRoutes;
|
||||
@ -3,11 +3,11 @@ import Views from '@/layouts/Views.vue';
|
||||
|
||||
export default [
|
||||
{
|
||||
path: '/sub-government-affairs-service/plantingAndBreeding',
|
||||
name: 'plantingAndBreeding',
|
||||
path: '/sub-government-affairs-service/trace',
|
||||
name: 'trace',
|
||||
component: Layout,
|
||||
redirect: '/sub-government-affairs-service/breeding',
|
||||
meta: { title: '种养殖管理', icon: 'Document' },
|
||||
meta: { title: '溯源管理', icon: 'Document' },
|
||||
children: [
|
||||
{
|
||||
path: '/sub-government-affairs-service/planting',
|
||||
@ -51,14 +51,11 @@ export default [
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace',
|
||||
name: 'trace',
|
||||
component: Layout,
|
||||
redirect: '/sub-government-affairs-service/trace-search',
|
||||
meta: { title: '溯源查询', icon: 'Document' },
|
||||
path: '/sub-government-affairs-service/trace-manage',
|
||||
name: 'trace-manage',
|
||||
component: Views,
|
||||
meta: { title: '溯源查询和统计', icon: 'Document' },
|
||||
children: [
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace-search',
|
||||
@ -75,4 +72,6 @@ export default [
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
@ -2,7 +2,7 @@
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
|
||||
@ -34,7 +34,7 @@
|
||||
<el-text class="mx-1" size="large">种植阶段详情</el-text>
|
||||
<div style="margin-top: 16px">
|
||||
<avue-crud
|
||||
ref="crudRef"
|
||||
ref="stateCrudRef"
|
||||
v-model="stageState.form"
|
||||
v-model:search="stageState.query"
|
||||
v-model:page="stageState.pageData"
|
||||
@ -48,6 +48,8 @@
|
||||
@current-change="stageCurrent"
|
||||
@size-change="stageSize"
|
||||
@row-del="stageRowDel"
|
||||
@row-save="stageRowSave"
|
||||
@row-update="stageRowUpdate"
|
||||
>
|
||||
<template #menu-left>
|
||||
<el-button type="primary" icon="Plus" @click="onStateAdd">新增</el-button>
|
||||
@ -61,61 +63,6 @@
|
||||
<custom-table-operate :actions="stageState.options.actions" :data="scope" />
|
||||
</template>
|
||||
</avue-crud>
|
||||
|
||||
<el-dialog v-model="stageInfoVisible" title="种植阶段" width="800" center>
|
||||
<el-form ref="stageInfoRef" :model="stageInfoData" :rules="stageInfoRules">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="地块:" prop="landName">
|
||||
<el-input v-model="stageInfoData.landName" placeholder="请输入地块" style="width: 240px" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="种植产物" prop="crop">
|
||||
<el-input v-model="stageInfoData.crop" placeholder="请输入种植产物" style="width: 240px" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="种植阶段" prop="stage">
|
||||
<CustomSelect
|
||||
v-model:value="stageInfoData.stage"
|
||||
:set="{
|
||||
url: '',
|
||||
options: stageOptions,
|
||||
props: {
|
||||
value: 'value',
|
||||
label: 'label',
|
||||
},
|
||||
}"
|
||||
placeholder="请选择种植阶段"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="作业计划" prop="workId">
|
||||
<CustomSelect
|
||||
v-model:value="stageInfoData.workId"
|
||||
:set="{
|
||||
url: '',
|
||||
options: workOptions,
|
||||
props: {
|
||||
value: 'id',
|
||||
label: 'planName',
|
||||
},
|
||||
}"
|
||||
placeholder="请选择作业计划"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="stageCancel">取消</el-button>
|
||||
<el-button type="primary" @click="subMitStateInfo(stageInfoRef)"> 确认 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -140,6 +87,7 @@ const { VITE_APP_BASE_API } = import.meta.env;
|
||||
const app = useApp();
|
||||
const UserStore = useUserStore();
|
||||
const crudRef = ref(null);
|
||||
const stateCrudRef = ref(null);
|
||||
const handleLandChange = async (value, form, done) => {
|
||||
if (!value || !value.item || !value.item.id) return; // 如果没有选择任何地块，则直接返回
|
||||
let val = {};
|
||||
@ -157,17 +105,21 @@ const handleLandChange = async (value, form, done) => {
|
||||
state.form.address = val?.county + val?.town + val?.village || value.item?.address;
|
||||
};
|
||||
|
||||
const jobTypeOptions = reactive([
|
||||
{ label: '施肥', value: '0' },
|
||||
{ label: '杀虫', value: '1' },
|
||||
{ label: '灌溉', value: '2' },
|
||||
]);
|
||||
|
||||
const stageOptions = reactive([
|
||||
{ value: '0', label: '苗期' },
|
||||
{ value: '1', label: '花果期' },
|
||||
{ value: '2', label: '采收期' },
|
||||
]);
|
||||
|
||||
const stageObj = reactive({
|
||||
0: '苗期',
|
||||
1: '花果期',
|
||||
2: '采收期',
|
||||
});
|
||||
const workOptions = reactive([
|
||||
{ planName: '作业计划1', id: '000001' },
|
||||
{ planName: '作业计划2', id: '000002' },
|
||||
]);
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
query: {
|
||||
@ -246,21 +198,6 @@ const state = reactive({
|
||||
data: [],
|
||||
currentRow: {},
|
||||
});
|
||||
const infoVisible = ref(false);
|
||||
const infoRef = ref();
|
||||
const infoData = reactive({
|
||||
num: '',
|
||||
name: '',
|
||||
member: [],
|
||||
type: '',
|
||||
mark: '',
|
||||
target: '',
|
||||
});
|
||||
|
||||
const infoRules = reactive({
|
||||
num: [{ required: true, message: '请选择是否违法', trigger: 'blur' }],
|
||||
mark: [{ required: true, message: '请输入巡查情况', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
const stageState = reactive({
|
||||
loading: false,
|
||||
@ -286,9 +223,20 @@ const stageState = reactive({
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{ label: '作业计划', prop: 'area', disabled: true },
|
||||
{ label: '作业时间', prop: 'coordinate', disabled: true },
|
||||
{ label: '结束时间', prop: 'createTime', disabled: true },
|
||||
{
|
||||
label: '作业计划',
|
||||
prop: 'workId',
|
||||
type: 'select',
|
||||
search: true,
|
||||
dicData: workOptions,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{ label: '作业时间', prop: 'coordinate', disabled: true, addDisplay: false, editDisplay: false },
|
||||
{ label: '结束时间', prop: 'createTime', disabled: true, addDisplay: false, editDisplay: false },
|
||||
],
|
||||
actions: [
|
||||
{
|
||||
@ -313,32 +261,6 @@ const stageState = reactive({
|
||||
currentRow: {},
|
||||
});
|
||||
|
||||
const stageObj = reactive({
|
||||
0: '苗期',
|
||||
1: '花果期',
|
||||
2: '采收期',
|
||||
});
|
||||
const workOptions = reactive([
|
||||
{ planName: '作业计划1', id: '000001' },
|
||||
{ planName: '作业计划2', id: '000002' },
|
||||
]);
|
||||
|
||||
let stageInfoVisible = ref(false);
|
||||
const stageInfoRef = ref();
|
||||
let stageInfoData = reactive({
|
||||
landId: '', //土地主键id
|
||||
planId: '', //种植规划主键id
|
||||
crop: '', //种植产物
|
||||
stage: '', //所属阶段
|
||||
workId: '', //作业计划Id
|
||||
landName: '', //地块
|
||||
});
|
||||
|
||||
const stageInfoRules = reactive({
|
||||
stage: [{ required: true, message: '请选择所属阶段', trigger: 'blur' }],
|
||||
workId: [{ required: true, message: '请选择作业计划', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 加载
|
||||
const loadData = () => {
|
||||
// state.loading = true;
|
||||
@ -444,27 +366,6 @@ const onExport = () => {
|
||||
// });
|
||||
};
|
||||
|
||||
const subMitInfo = (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.validate((valid) => {
|
||||
if (valid) {
|
||||
infoHide();
|
||||
console.log('submit!');
|
||||
} else {
|
||||
console.log('error submit!');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const infoCancel = () => {
|
||||
infoHide();
|
||||
};
|
||||
|
||||
const infoHide = () => {
|
||||
infoRef.value && infoRef.value.resetFields();
|
||||
infoVisible.value = false;
|
||||
};
|
||||
|
||||
const rowUpdate = (row, index, done, loading) => {
|
||||
console.info('更新');
|
||||
// editOperationRecord(row)
|
||||
@ -564,61 +465,7 @@ const stageRowDel = (row, index, done) => {
|
||||
.catch(() => {});
|
||||
};
|
||||
const stageRowEdit = (row) => {
|
||||
stageInfoData.landName = row.landName ? row.landName : state.currentRow.landName || '';
|
||||
stageInfoData.landId = row.landId ? row.landId : state.currentRow.landId || '';
|
||||
stageInfoData.crop = row.crop ? row.crop : state.currentRow.crop || '';
|
||||
stageInfoData.stage = row.stage.toString() || '0';
|
||||
stageInfoVisible.value = true;
|
||||
};
|
||||
|
||||
const stageinfoHide = () => {
|
||||
stageInfoRef.value && stageInfoRef.value.resetFields();
|
||||
stageInfoVisible.value = false;
|
||||
};
|
||||
|
||||
const subMitStateInfo = (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.validate((valid) => {
|
||||
if (valid) {
|
||||
let parmer = {
|
||||
planId: state.currentRow.id || '', //种植规划主键id
|
||||
stage: stageInfoData.stage || 0, //种植阶段:0->苗期,1>花果期,2->采收期
|
||||
workId: stageInfoData.workId || '',
|
||||
};
|
||||
|
||||
console.info('新增种植阶段', parmer);
|
||||
|
||||
if (parmer.id) {
|
||||
// editPlantingStage(parmer)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('编辑成功！');
|
||||
// getStageList();
|
||||
// stageinfoHide();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {});
|
||||
} else {
|
||||
// savePlantingStage(parmer)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// getStageList();
|
||||
// stageinfoHide();
|
||||
// app.$message.success('添加成功！');
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {});
|
||||
}
|
||||
} else {
|
||||
console.log('error submit!');
|
||||
}
|
||||
});
|
||||
stateCrudRef.value.rowEdit(row);
|
||||
};
|
||||
|
||||
const onStateAdd = () => {
|
||||
@ -626,8 +473,46 @@ const onStateAdd = () => {
|
||||
app.$message.error('请选择种植产物');
|
||||
return;
|
||||
}
|
||||
stageInfoData.landName = state.currentRow.landName || '';
|
||||
stageInfoData.crop = state.currentRow.crop || '';
|
||||
stageInfoVisible.value = true;
|
||||
// stageInfoData.landName = state.currentRow.landName || '';
|
||||
// stageInfoData.crop = state.currentRow.crop || '';
|
||||
// stageInfoVisible.value = true;
|
||||
stateCrudRef.value.rowAdd();
|
||||
};
|
||||
|
||||
const stageRowSave = (row, done, loading) => {
|
||||
row.planId = state.currentRow.planId;
|
||||
console.info('stageRowSave', row);
|
||||
// savePlantingStage({ ...row })
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('添加成功！');
|
||||
// done();
|
||||
// getStageList();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// loading();
|
||||
// });
|
||||
};
|
||||
|
||||
const stageRowUpdate = (row, index, done, loading) => {
|
||||
console.info('stageRowUpdate');
|
||||
// editPlantingStage(row)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('更新成功！');
|
||||
// done();
|
||||
// getStageList();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// loading();
|
||||
// });
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -21,6 +21,8 @@
|
||||
@current-change="currentChange"
|
||||
@size-change="sizeChange"
|
||||
@row-del="rowDel"
|
||||
@row-save="rowSave"
|
||||
@row-update="rowUpdate"
|
||||
>
|
||||
<template #menu-left>
|
||||
<el-button type="primary" icon="Plus" @click="onAdd">新增</el-button>
|
||||
@ -34,44 +36,6 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-dialog v-model="infoVisible" title="新增土地分类" width="800" center>
|
||||
<div>
|
||||
<el-form ref="infoRef" :model="infoData" :rules="infoRules">
|
||||
<el-row :gutter="20">
|
||||
<el-col v-if="infoData.classifyId == ''" :span="12">
|
||||
<el-form-item label="土地分类:" prop="classifyName">
|
||||
<el-input v-model="infoData.classifyName" placeholder="请输入" style="width: 240px"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col v-if="infoData.classifyId != ''" :span="12">
|
||||
<el-form-item label="土地分类" prop="classifyId">
|
||||
<el-select
|
||||
v-model="infoData.classifyId"
|
||||
placeholder="请选择土地分类"
|
||||
:disabled="true"
|
||||
style="width: 240px"
|
||||
:clearable="true"
|
||||
:multiple="false"
|
||||
>
|
||||
<el-option v-for="item in landUsedOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="土地类别:" prop="category">
|
||||
<el-input v-model="infoData.category" placeholder="请输入" style="width: 240px"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="infoCancel">取消</el-button>
|
||||
<el-button type="primary" @click="subMitInfo(infoRef)"> 确认 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</CustomCard>
|
||||
</template>
|
||||
<script setup>
|
||||
@ -85,6 +49,12 @@ const app = useApp();
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
const crudRef = ref(null);
|
||||
const landUsedOptions = reactive([
|
||||
{ label: '农用地', value: '0' },
|
||||
{ label: '建设用地', value: '1' },
|
||||
{ label: '住宅用地', value: '2' },
|
||||
]);
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
query: {
|
||||
@ -98,10 +68,20 @@ const state = reactive({
|
||||
addBtnText: '',
|
||||
addBtn: false,
|
||||
column: [
|
||||
{ label: '编号', prop: 'gridManager' },
|
||||
{ label: '土地分类', prop: 'gridManager' },
|
||||
{ label: '编号', prop: 'gridManager', addDisplay: false, editDisplay: false },
|
||||
{
|
||||
label: '土地分类',
|
||||
prop: 'gridManager',
|
||||
dicData: landUsedOptions,
|
||||
multiple: true,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{ label: '土地类别', prop: 'gridManager' },
|
||||
{ label: '状态', prop: 'gridManager' },
|
||||
{ label: '状态', prop: 'gridManager', addDisplay: false, editDisplay: false },
|
||||
],
|
||||
actions: [
|
||||
{
|
||||
@ -152,24 +132,6 @@ let typeTree = reactive([
|
||||
},
|
||||
]);
|
||||
|
||||
const infoVisible = ref(false);
|
||||
const infoRef = ref();
|
||||
const landUsedOptions = reactive([
|
||||
{ label: '农用地', value: '0' },
|
||||
{ label: '建设用地', value: '1' },
|
||||
{ label: '住宅用地', value: '2' },
|
||||
]);
|
||||
|
||||
let infoData = reactive({
|
||||
classifyId: '',
|
||||
category: '',
|
||||
classifyName: '',
|
||||
});
|
||||
|
||||
const infoRules = reactive({
|
||||
planName: [{ required: true, message: '请输入计划名称', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
@ -232,8 +194,7 @@ const selectionChange = (rows) => {
|
||||
};
|
||||
|
||||
const handleNodeClick = (data) => {
|
||||
infoData.classifyId = data.pId ? data.pId : data.id;
|
||||
console.log(infoData);
|
||||
console.log('handleNodeClick', data);
|
||||
};
|
||||
// 编辑
|
||||
const rowStatus = (row) => {
|
||||
@ -251,22 +212,48 @@ const getStatusButtonText = (status) => {
|
||||
}
|
||||
};
|
||||
|
||||
const rowEdit = () => {};
|
||||
const rowEdit = (row) => {
|
||||
crudRef.value && crudRef.value.rowEdit(row);
|
||||
};
|
||||
|
||||
const onAdd = () => {
|
||||
infoVisible.value = true;
|
||||
crudRef.value && crudRef.value.rowAdd();
|
||||
};
|
||||
const onExport = () => {};
|
||||
|
||||
const subMitInfo = (formEl) => {};
|
||||
|
||||
const infoCancel = () => {
|
||||
infoHide();
|
||||
const rowSave = (row, done, loading) => {
|
||||
// console.info('新增', row);
|
||||
// saveOperationRecord(row)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('添加成功！');
|
||||
// done();
|
||||
// loadData();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// loading();
|
||||
// });
|
||||
};
|
||||
|
||||
const infoHide = () => {
|
||||
infoRef.value && infoRef.value.resetFields();
|
||||
infoVisible.value = false;
|
||||
const rowUpdate = (row, index, done, loading) => {
|
||||
console.info('更新');
|
||||
// editOperationRecord(row)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('更新成功！');
|
||||
// done();
|
||||
// loadData();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// loading();
|
||||
// });
|
||||
};
|
||||
|
||||
// #region
|
||||
|
||||
@ -34,46 +34,6 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-dialog v-model="infoVisible" title="新增行政区域信息" width="800" center>
|
||||
<div>
|
||||
<el-form ref="infoRef" :model="infoData" :rules="infoRules">
|
||||
<el-row :gutter="20">
|
||||
<el-col v-if="infoData.countyId != ''" :span="12">
|
||||
<el-form-item label="县" prop="countyId">
|
||||
<el-select
|
||||
v-model="infoData.countyId"
|
||||
placeholder="请选择县"
|
||||
:disabled="true"
|
||||
style="width: 240px"
|
||||
:clearable="true"
|
||||
:multiple="false"
|
||||
>
|
||||
<el-option v-for="item in countyOptions" :key="item.id" :label="item.label" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col v-if="infoData.townId != ''" :span="12">
|
||||
<el-form-item label="镇" prop="townId">
|
||||
<el-select v-model="infoData.townId" placeholder="请选择镇" :disabled="true" style="width: 240px" :clearable="true" :multiple="false">
|
||||
<el-option v-for="item in townOptions" :key="item.id" :label="item.label" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称:" prop="name">
|
||||
<el-input v-model="infoData.name" placeholder="请输入" style="width: 240px"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="infoCancel">取消</el-button>
|
||||
<el-button type="primary" @click="subMitInfo(infoRef)"> 确认 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</CustomCard>
|
||||
</template>
|
||||
<script setup>
|
||||
@ -81,12 +41,16 @@ import { ref, reactive, onMounted } from 'vue';
|
||||
import { useApp } from '@/hooks';
|
||||
import { CRUD_OPTIONS } from '@/config';
|
||||
import CustomCard from '@/components/CustomCard.vue';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
|
||||
const { VITE_APP_BASE_API } = import.meta.env;
|
||||
const app = useApp();
|
||||
const UserStore = useUserStore();
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
|
||||
const crudRef = ref(null);
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
query: {
|
||||
@ -100,11 +64,32 @@ const state = reactive({
|
||||
addBtnText: '',
|
||||
addBtn: false,
|
||||
column: [
|
||||
{ label: '编号', prop: 'gridManager' },
|
||||
{ label: '所属区县', prop: 'gridManager' },
|
||||
{ label: '所属乡镇', prop: 'gridManager' },
|
||||
{ label: '村名', prop: 'gridManager' },
|
||||
{ label: '状态', prop: 'gridManager' },
|
||||
{ label: '编号', prop: 'gridManager', addDisplay: false, editDisplay: false },
|
||||
{
|
||||
label: '所属上级',
|
||||
prop: 'villageCode',
|
||||
type: 'cascader',
|
||||
checkStrictly: true,
|
||||
props: {
|
||||
label: 'areaName',
|
||||
value: 'areaCode',
|
||||
children: 'areaChildVOS',
|
||||
},
|
||||
dicUrl: `${VITE_APP_BASE_API}/system/area/region?areaCode=530000`,
|
||||
dicHeaders: {
|
||||
authorization: UserStore.token,
|
||||
},
|
||||
dicFormatter: (res) => res.data ?? [],
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{ label: '名称', prop: 'gridManager' },
|
||||
{ label: '状态', prop: 'gridManager', addDisplay: false, editDisplay: false },
|
||||
],
|
||||
actions: [
|
||||
{
|
||||
@ -160,13 +145,6 @@ let typeTree = reactive([
|
||||
children: [{ label: '镇1', children: [], id: '11', pId: '10', level: '1' }],
|
||||
},
|
||||
]);
|
||||
|
||||
const infoVisible = ref(false);
|
||||
const infoRef = ref();
|
||||
const countyOptions = reactive([
|
||||
{ label: '耿马县', id: '0' },
|
||||
{ label: '县1', id: '1' },
|
||||
]);
|
||||
let townOptions = reactive([]);
|
||||
|
||||
let infoData = reactive({
|
||||
@ -175,10 +153,6 @@ let infoData = reactive({
|
||||
name: '',
|
||||
});
|
||||
|
||||
const infoRules = reactive({
|
||||
planName: [{ required: true, message: '请输入计划名称', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
@ -278,24 +252,15 @@ const getStatusButtonText = (status) => {
|
||||
}
|
||||
};
|
||||
|
||||
const rowEdit = () => {};
|
||||
const rowEdit = (row) => {
|
||||
crudRef.value && crudRef.value.rowEdit(row);
|
||||
};
|
||||
|
||||
const onAdd = () => {
|
||||
infoVisible.value = true;
|
||||
// infoVisible.value = true;
|
||||
crudRef.value && crudRef.value.rowAdd();
|
||||
};
|
||||
const onExport = () => {};
|
||||
|
||||
const subMitInfo = (formEl) => {};
|
||||
|
||||
const infoCancel = () => {
|
||||
infoHide();
|
||||
};
|
||||
|
||||
const infoHide = () => {
|
||||
infoRef.value && infoRef.value.resetFields();
|
||||
infoVisible.value = false;
|
||||
};
|
||||
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
|
||||
@ -24,6 +24,16 @@
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="state.options.actions" :data="scope" />
|
||||
</template>
|
||||
|
||||
<template #isIllegal="{ row }">
|
||||
<el-tag v-if="row.isIllegal == '1'" type="danger">是</el-tag>
|
||||
<el-tag v-if="row.isIllegal == '0'" type="success">否</el-tag>
|
||||
</template>
|
||||
|
||||
<template #inspectionStatus="{ row }">
|
||||
<el-tag v-if="row.inspectionStatus == '1'" type="success">已结束</el-tag>
|
||||
<el-tag v-if="row.inspectionStatus == '0'">进行中</el-tag>
|
||||
</template>
|
||||
</avue-crud>
|
||||
|
||||
<el-dialog v-model="infoVisible" title="巡查任务" width="800" center>
|
||||
@ -69,13 +79,13 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue';
|
||||
import { reactive, ref, h } from 'vue';
|
||||
import { useApp } from '@/hooks';
|
||||
import { CRUD_OPTIONS } from '@/config';
|
||||
import { isEmpty, downloadFile } from '@/utils';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { compact } from 'lodash';
|
||||
import { getlandInspection, savelandInspection, editlandInspection, exportOperationRecord, getAddrCropByLand } from '@/apis/land';
|
||||
import { getlandInspection, savelandInspection, enrolllandInspection, exportlandInspection, getAddrCropByLand } from '@/apis/land';
|
||||
import { progressProps } from 'element-plus';
|
||||
|
||||
const { VITE_APP_BASE_API } = import.meta.env;
|
||||
const app = useApp();
|
||||
@ -103,6 +113,7 @@ const jobTypeOptions = reactive([
|
||||
{ label: '杀虫', value: '1' },
|
||||
{ label: '灌溉', value: '2' },
|
||||
]);
|
||||
const isDisabled = ref(false);
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
query: {
|
||||
@ -117,12 +128,14 @@ const state = reactive({
|
||||
options: {
|
||||
...CRUD_OPTIONS,
|
||||
addBtnText: '新增',
|
||||
updateBtnText: '确定',
|
||||
column: [
|
||||
{
|
||||
label: '任务编号',
|
||||
prop: 'taskCode',
|
||||
fixed: true,
|
||||
search: true,
|
||||
editDisplay: false,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -135,6 +148,7 @@ const state = reactive({
|
||||
search: true,
|
||||
width: '240px',
|
||||
showOverflowTooltip: true,
|
||||
editDisplay: false,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -146,6 +160,7 @@ const state = reactive({
|
||||
search: true,
|
||||
prop: 'taskMembers',
|
||||
disabled: false,
|
||||
editDisplay: false,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -155,6 +170,7 @@ const state = reactive({
|
||||
{
|
||||
label: '巡查类型',
|
||||
prop: 'inspectionType',
|
||||
editDisplay: false,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -164,6 +180,7 @@ const state = reactive({
|
||||
{
|
||||
label: '巡查对象',
|
||||
prop: 'inspectionTarget',
|
||||
editDisplay: false,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -174,6 +191,9 @@ const state = reactive({
|
||||
label: '注意事项',
|
||||
prop: 'notes',
|
||||
type: 'textarea',
|
||||
minRows: 2, // 设置最小行数
|
||||
maxRows: 5, // 设置最大行数
|
||||
editDisplay: false,
|
||||
rows: 1,
|
||||
rules: {
|
||||
required: true,
|
||||
@ -181,6 +201,111 @@ const state = reactive({
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '是否违法',
|
||||
prop: 'isIllegal',
|
||||
editDisplay: false,
|
||||
addDisplay: false,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
prop: 'inspectionStatus',
|
||||
editDisplay: false,
|
||||
addDisplay: false,
|
||||
},
|
||||
],
|
||||
group: [
|
||||
{
|
||||
label: '任务信息>',
|
||||
prop: 'caseInfo',
|
||||
addDisplay: false,
|
||||
column: [
|
||||
{
|
||||
label: '任务编号',
|
||||
prop: 'taskCode',
|
||||
render: ({ row }) => {
|
||||
return h('span', {}, row.taskCode);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '任务名称',
|
||||
prop: 'taskName',
|
||||
render: ({ row }) => {
|
||||
return h('span', {}, row.taskCode);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '任务成员',
|
||||
prop: 'taskMembers',
|
||||
render: ({ row }) => {
|
||||
return h('span', {}, row.taskCode);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '巡查类型',
|
||||
prop: 'inspectionType',
|
||||
render: ({ row }) => {
|
||||
return h('span', {}, row.taskCode);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '巡查对象',
|
||||
prop: 'inspectionTarget',
|
||||
render: ({ row }) => {
|
||||
return h('span', {}, row.taskCode);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '注意事项',
|
||||
prop: 'notes',
|
||||
render: ({ row }) => {
|
||||
return h('span', {}, row.taskCode);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '巡查信息登记>',
|
||||
prop: 'caseInfo',
|
||||
addDisplay: false,
|
||||
column: [
|
||||
{
|
||||
label: '是否违法',
|
||||
prop: 'isIllegal',
|
||||
span: 24,
|
||||
display: true,
|
||||
type: 'radio',
|
||||
editDisplay: true,
|
||||
disabled: isDisabled,
|
||||
dicData: [
|
||||
{
|
||||
label: '是',
|
||||
value: '1',
|
||||
},
|
||||
{
|
||||
label: '否',
|
||||
value: '0',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '巡查情况',
|
||||
prop: 'inspectionSituation',
|
||||
type: 'textarea',
|
||||
disabled: isDisabled,
|
||||
span: 24,
|
||||
minRows: 3, // 设置最小行数
|
||||
maxRows: 5, // 设置最大行数
|
||||
display: true,
|
||||
editDisplay: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
searchColumn: [],
|
||||
actions: [
|
||||
@ -295,15 +420,21 @@ const rowSave = (row, done, loading) => {
|
||||
const doEnroll = (row) => {
|
||||
console.info('doEnroll', row);
|
||||
// infoVisible.value = true;
|
||||
isDisabled.value = row.inspectionStatus == '1';
|
||||
crudRef.value.rowEdit(row);
|
||||
};
|
||||
|
||||
const rowUpdate = (row, index, done, loading) => {
|
||||
console.info('更新');
|
||||
editlandInspection(row)
|
||||
console.info('登记结果');
|
||||
let parmer = {
|
||||
id: row.id || '',
|
||||
isIllegal: row.isIllegal || '0', //巡查结果是否违法（0 否，1 是）
|
||||
inspectionSituation: row.inspectionSituation || '', //巡查情况
|
||||
};
|
||||
enrolllandInspection(parmer)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('更新成功！');
|
||||
app.$message.success('登记结果成功！');
|
||||
done();
|
||||
loadData();
|
||||
}
|
||||
@ -324,7 +455,7 @@ const onExport = () => {
|
||||
}
|
||||
state.loading = true;
|
||||
const fileName = '土地巡查明细表';
|
||||
exportOperationRecord(state.query)
|
||||
exportlandInspection(state.query)
|
||||
.then((res) => {
|
||||
if (res.status === 200) {
|
||||
downloadFile(res.data, `${fileName}.xlsx`, 'blob');
|
||||
|
||||
@ -83,57 +83,6 @@
|
||||
<custom-table-operate :actions="stageState.options.actions" :data="scope" />
|
||||
</template>
|
||||
</avue-crud>
|
||||
|
||||
<!-- <el-dialog v-model="stageInfoVisible" title="种植阶段" width="800" center>
|
||||
<el-form ref="stageInfoRef" :model="stageInfoData" :rules="stageInfoRules">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="地块:" prop="landName">
|
||||
<el-input v-model="stageInfoData.landName" placeholder="请输入地块" style="width: 240px" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="种植产物" prop="crop">
|
||||
<el-input v-model="stageInfoData.crop" placeholder="请输入种植产物" style="width: 240px" :disabled="true"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="种植阶段" prop="stage">
|
||||
<CustomSelect
|
||||
v-model:value="stageInfoData.stage"
|
||||
:set="{
|
||||
url: '',
|
||||
options: stageOptions,
|
||||
props: {
|
||||
value: 'value',
|
||||
label: 'label',
|
||||
},
|
||||
}"
|
||||
placeholder="请选择种植阶段"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="作业计划" prop="workId">
|
||||
<CustomSelect
|
||||
v-model:value="stageInfoData.workId"
|
||||
:set="{
|
||||
url: '',
|
||||
options: workOptions,
|
||||
}"
|
||||
placeholder="请选择作业计划"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="stageCancel">取消</el-button>
|
||||
<el-button type="primary" @click="subMitStateInfo(stageInfoRef)"> 确认 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -142,7 +91,6 @@ import { reactive, ref } from 'vue';
|
||||
import { useApp } from '@/hooks';
|
||||
import { CRUD_OPTIONS } from '@/config';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { compact } from 'lodash';
|
||||
import {
|
||||
getPlanList,
|
||||
savePlan,
|
||||
@ -154,8 +102,6 @@ import {
|
||||
editPlantingStage,
|
||||
delPlantingStage,
|
||||
} from '@/apis/land.js';
|
||||
import CustomCard from '@/components/CustomCard.vue';
|
||||
import CustomSelect from '@/components/CustomSelect.vue';
|
||||
import { isEmpty, imageToBase64, getAssetsFile, downloadFile } from '@/utils';
|
||||
|
||||
const { VITE_APP_BASE_API } = import.meta.env;
|
||||
@ -393,35 +339,12 @@ let infoFirst = ref({
|
||||
planDate: '',
|
||||
});
|
||||
|
||||
const infoRules = reactive({
|
||||
crop: [{ required: true, message: '请输入种植产物', trigger: 'blur' }],
|
||||
planId: [{ required: true, message: '请选择种植计划', trigger: 'blur' }],
|
||||
seedSupplier: [{ required: true, message: '请输入供应商', trigger: 'blur' }],
|
||||
planDate: [{ required: true, message: '请选择种植时间', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
const stageObj = reactive({
|
||||
0: '苗期',
|
||||
1: '花果期',
|
||||
2: '采收期',
|
||||
});
|
||||
|
||||
let stageInfoVisible = ref(false);
|
||||
const stageInfoRef = ref();
|
||||
let stageInfoData = reactive({
|
||||
landId: '', //土地主键id
|
||||
planId: '', //种植规划主键id
|
||||
crop: '', //种植产物
|
||||
stage: '', //所属阶段
|
||||
workId: '', //作业计划Id
|
||||
landName: '', //地块
|
||||
});
|
||||
|
||||
const stageInfoRules = reactive({
|
||||
stage: [{ required: true, message: '请选择所属阶段', trigger: 'blur' }],
|
||||
workId: [{ required: true, message: '请选择作业计划', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 加载
|
||||
const loadData = () => {
|
||||
state.loading = true;
|
||||
@ -571,20 +494,20 @@ const onExport = () => {
|
||||
return;
|
||||
}
|
||||
state.loading = true;
|
||||
const fileName = '种植记录明细表';
|
||||
// exportPlan(state.query)
|
||||
// .then((res) => {
|
||||
// if (res.status === 200) {
|
||||
// downloadFile(res.data, `${fileName}.xlsx`, 'blob');
|
||||
// app.$message.success('导出成功！');
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error('导出失败！');
|
||||
// })
|
||||
// .finally(() => {
|
||||
// state.loading = false;
|
||||
// });
|
||||
const fileName = '种植规划明细表';
|
||||
exportPlan(state.query)
|
||||
.then((res) => {
|
||||
if (res.status === 200) {
|
||||
downloadFile(res.data, `${fileName}.xlsx`, 'blob');
|
||||
app.$message.success('导出成功！');
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error('导出失败！');
|
||||
})
|
||||
.finally(() => {
|
||||
state.loading = false;
|
||||
});
|
||||
};
|
||||
|
||||
const onAdd = () => {
|
||||
|
||||
@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<div class="analysis">
|
||||
<el-row :gutter="16" style="margin-bottom: 10px">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-bar :chart-data="state.yieldTrendData" height="460px" :option="state.yieldTrendOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-line :chart-data="state.yieldData" height="460px" :option="state.yieldOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="24">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-mixin :chart-data="state.inputOtputRatioData" :option="state.inputOtputRatioOption" height="500px" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
|
||||
const state = reactive({
|
||||
yieldTrendOption: {
|
||||
color: ['#3685fe', '#41b879', '#ffd500'],
|
||||
title: {
|
||||
text: '产量趋势',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
label: {
|
||||
color: '#333',
|
||||
},
|
||||
barStyle: {
|
||||
barWidth: 50,
|
||||
stack: 'total',
|
||||
},
|
||||
},
|
||||
yieldTrendData: [
|
||||
{ value: 80, type: '花生', name: '耿马镇' },
|
||||
{ value: 105, type: '花生', name: '大兴乡' },
|
||||
{ value: 187, type: '花生', name: '孟定镇' },
|
||||
{ value: 100, type: '土豆', name: '耿马镇' },
|
||||
{ value: 125, type: '土豆', name: '大兴乡' },
|
||||
{ value: 217, type: '土豆', name: '孟定镇' },
|
||||
{ value: 200, type: '玉米', name: '耿马镇' },
|
||||
{ value: 155, type: '玉米', name: '大兴乡' },
|
||||
{ value: 247, type: '玉米', name: '孟定镇' },
|
||||
],
|
||||
yieldOption: {
|
||||
color: ['#3685fe', '#41b879', '#ffd500'],
|
||||
title: {
|
||||
text: '单产水平',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '年份',
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '产量',
|
||||
// splitLine: {
|
||||
// show: false,
|
||||
// },
|
||||
},
|
||||
},
|
||||
yieldData: [
|
||||
{
|
||||
type: '花生',
|
||||
value: 40,
|
||||
name: '2022',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 146,
|
||||
name: '2022',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 81,
|
||||
name: '2022',
|
||||
},
|
||||
{
|
||||
type: '花生',
|
||||
value: 60,
|
||||
name: '2023',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 166,
|
||||
name: '2023',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 101,
|
||||
name: '2023',
|
||||
},
|
||||
{
|
||||
type: '花生',
|
||||
value: 80,
|
||||
name: '2024',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 176,
|
||||
name: '2024',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 91,
|
||||
name: '2024',
|
||||
},
|
||||
],
|
||||
inputOtputRatioOption: {
|
||||
color: ['#3685fe', '#41b879', '#ffd500', '#e57373'],
|
||||
title: {
|
||||
text: '投入品产出比',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ['农药', '化肥', '产出', '产出比'],
|
||||
},
|
||||
},
|
||||
inputOtputRatioData: [
|
||||
{
|
||||
name: '耿马',
|
||||
value: 40,
|
||||
type: '农药',
|
||||
seriesType: 'bar',
|
||||
},
|
||||
{
|
||||
name: '耿马',
|
||||
value: 30,
|
||||
type: '化肥',
|
||||
seriesType: 'bar',
|
||||
},
|
||||
{
|
||||
name: '耿马',
|
||||
value: 100,
|
||||
type: '产出',
|
||||
seriesType: 'bar',
|
||||
},
|
||||
{
|
||||
name: '耿马',
|
||||
value: 60,
|
||||
type: '产出比',
|
||||
seriesType: 'line',
|
||||
},
|
||||
{
|
||||
name: '大香乡',
|
||||
value: 20,
|
||||
type: '农药',
|
||||
seriesType: 'bar',
|
||||
},
|
||||
{
|
||||
name: '大香乡',
|
||||
value: 20,
|
||||
type: '化肥',
|
||||
seriesType: 'bar',
|
||||
},
|
||||
{
|
||||
name: '大香乡',
|
||||
value: 80,
|
||||
type: '产出',
|
||||
seriesType: 'bar',
|
||||
},
|
||||
{
|
||||
name: '大香乡',
|
||||
value: 40,
|
||||
type: '产出比',
|
||||
seriesType: 'line',
|
||||
},
|
||||
],
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.analysis {
|
||||
&-title {
|
||||
font-size: 20px;
|
||||
color: #000;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<div class="analysis">
|
||||
<el-row :gutter="16" style="margin-bottom: 10px">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-line :chart-data="state.soilQualityData" height="460px" :option="state.soilQualityOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-bar :chart-data="state.costBenefitData" height="460px" :option="state.costBenefitOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="24">
|
||||
<el-card shadow="hover">
|
||||
<custom-echart-line :chart-data="state.marketPriceData" height="500px" :option="state.marketPriceOption" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
|
||||
const state = reactive({
|
||||
soilQualityOption: {
|
||||
color: ['#3685fe', '#41b879', '#fed500'],
|
||||
title: {
|
||||
text: '土壤质量检测',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '年份',
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '',
|
||||
},
|
||||
},
|
||||
soilQualityData: [
|
||||
{
|
||||
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',
|
||||
},
|
||||
],
|
||||
costBenefitOption: {
|
||||
title: {
|
||||
text: '成本收益分析',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
label: {
|
||||
color: '#333',
|
||||
},
|
||||
barStyle: {
|
||||
barWidth: 50,
|
||||
},
|
||||
},
|
||||
costBenefitData: [
|
||||
{ value: 80, type: '成本', name: '2022' },
|
||||
{ value: 105, type: '收入', name: '2022' },
|
||||
{ value: 187, type: '利润', name: '2022' },
|
||||
{ value: 100, type: '成本', name: '2023' },
|
||||
{ value: 125, type: '收入', name: '2023' },
|
||||
{ value: 217, type: '利润', name: '2023' },
|
||||
{ value: 200, type: '成本', name: '2024' },
|
||||
{ value: 155, type: '收入', name: '2024' },
|
||||
{ value: 247, type: '利润', name: '2024' },
|
||||
],
|
||||
marketPriceOption: {
|
||||
color: ['#3685fe', '#41b879', '#fed500'],
|
||||
title: {
|
||||
text: '市场价格波动',
|
||||
textStyle: {
|
||||
color: '#333',
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '月份',
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '价格（元）',
|
||||
},
|
||||
},
|
||||
marketPriceData: [
|
||||
{
|
||||
type: '花生',
|
||||
value: 40,
|
||||
name: '1月',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 146,
|
||||
name: '1月',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 81,
|
||||
name: '1月',
|
||||
},
|
||||
{
|
||||
type: '花生',
|
||||
value: 60,
|
||||
name: '2月',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 186,
|
||||
name: '2月',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 101,
|
||||
name: '2月',
|
||||
},
|
||||
{
|
||||
type: '花生',
|
||||
value: 230,
|
||||
name: '3月',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 256,
|
||||
name: '3月',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 301,
|
||||
name: '3月',
|
||||
},
|
||||
{
|
||||
type: '花生',
|
||||
value: 160,
|
||||
name: '4月',
|
||||
},
|
||||
{
|
||||
type: '土豆',
|
||||
value: 286,
|
||||
name: '4月',
|
||||
},
|
||||
{
|
||||
type: '玉米',
|
||||
value: 161,
|
||||
name: '4月',
|
||||
},
|
||||
],
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.analysis {
|
||||
&-title {
|
||||
font-size: 20px;
|
||||
color: #000;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,261 +0,0 @@
|
||||
<template>
|
||||
<section>农业生产效率分析</section>
|
||||
<div>
|
||||
<el-row :gutter="20" style="margin: 16px 0">
|
||||
<el-col :span="24">
|
||||
<el-card>
|
||||
<div ref="rOI" style="width: 100%; height: 200px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="24" style="margin: 16px 0">
|
||||
<el-card>
|
||||
<div ref="yieldSingle" style="width: 100%; height: 200px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-card>
|
||||
<div ref="yieldTrend" style="width: 100%; height: 200px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, onMounted } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
const rOI = ref(null);
|
||||
const yieldSingle = ref(null);
|
||||
const yieldTrend = ref(null);
|
||||
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
onMounted(() => {
|
||||
const rOIChart = echarts.init(rOI.value);
|
||||
const yieldSingleChart = echarts.init(yieldSingle.value);
|
||||
const yieldTrendChart = echarts.init(yieldTrend.value);
|
||||
|
||||
const rOIoption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '产量趋势',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
legend: {
|
||||
data: ['土豆', '花生', '水稻', '西红柿', '玉米'],
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
saveAsImage: {},
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['2020', '2021', '2022', '2023', '2024'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '土豆',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [120, 132, 101, 100, 90, 230, 210],
|
||||
color: 'rgb(80,135,236)',
|
||||
smooth: true,
|
||||
},
|
||||
{
|
||||
name: '花生',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [100, 101, 191, 234, 290, 158, 259],
|
||||
color: 'rgb(104,187,196)',
|
||||
smooth: true,
|
||||
},
|
||||
{
|
||||
name: '水稻',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [150, 232, 201, 154, 190, 200, 250],
|
||||
color: 'rgb(88,165,92)',
|
||||
},
|
||||
{
|
||||
name: '西红柿',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [128, 156, 180, 60, 190, 157, 169],
|
||||
color: 'rgb(242,189,66)',
|
||||
},
|
||||
{
|
||||
name: '玉米',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [100, 232, 201, 154, 190, 330, 200],
|
||||
color: 'rgb(238,117,47)',
|
||||
},
|
||||
],
|
||||
};
|
||||
const yieldSingloption = {
|
||||
title: {
|
||||
text: '单产水平',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
},
|
||||
legend: {},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: ['新乡镇', '马关镇', '五华区', '官渡区', '北市区', '呈贡区', '西山区'],
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '花生',
|
||||
type: 'bar',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
data: [320, 332, 301, 334, 390, 330, 320],
|
||||
},
|
||||
{
|
||||
name: '土豆',
|
||||
type: 'bar',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
data: [120, 132, 101, 134, 90, 230, 210],
|
||||
},
|
||||
{
|
||||
name: '玉米',
|
||||
type: 'bar',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
data: [220, 182, 191, 234, 290, 330, 310],
|
||||
},
|
||||
{
|
||||
name: '水稻',
|
||||
type: 'bar',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
},
|
||||
{
|
||||
name: '西红柿',
|
||||
barWidth: '12px',
|
||||
type: 'bar',
|
||||
data: [862, 1018, 964, 1026, 1679, 1600, 1570],
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
// markLine: {
|
||||
// lineStyle: {
|
||||
// type: 'dashed',
|
||||
// },
|
||||
// data: [[{ type: 'min' }, { type: 'max' }]],
|
||||
// },
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const yieldTrendoption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '产量趋势',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
legend: {
|
||||
data: ['土豆', '花生', '水稻', '西红柿', '玉米'],
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
saveAsImage: {},
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['2020', '2021', '2022', '2023', '2024'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '耕地',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [120, 132, 101, 134, 90, 230, 210],
|
||||
color: 'rgb(80,135,236)',
|
||||
},
|
||||
{
|
||||
name: '林地',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [220, 182, 191, 234, 290, 330, 310],
|
||||
color: 'rgb(104,187,196)',
|
||||
},
|
||||
{
|
||||
name: '建设用地',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
color: 'rgb(88,165,92)',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
rOIoption && rOIChart.setOption(rOIoption);
|
||||
yieldSingloption && yieldSingleChart.setOption(yieldSingloption);
|
||||
});
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@ -1,265 +0,0 @@
|
||||
<template>
|
||||
<section>环境影响与经济效益分析</section>
|
||||
<div>
|
||||
<el-row :gutter="20" style="margin: 16px 0">
|
||||
<el-col :span="24">
|
||||
<el-card>
|
||||
<div ref="environment" style="width: 100%; height: 200px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="24" style="margin: 16px 0">
|
||||
<el-card>
|
||||
<div ref="market" style="width: 100%; height: 200px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-card>
|
||||
<div ref="profit" style="width: 100%; height: 200px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, onMounted } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
const environment = ref(null);
|
||||
const market = ref(null);
|
||||
const profit = ref(null);
|
||||
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
onMounted(() => {
|
||||
const environmentChart = echarts.init(environment.value);
|
||||
const marketChart = echarts.init(market.value);
|
||||
const profitChart = echarts.init(profit.value);
|
||||
|
||||
const environmentOption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '土壤质量监测',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
legend: {
|
||||
data: ['土壤肥力', '酸碱度', '重金属含量'],
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
saveAsImage: {},
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['2020', '2021', '2022', '2023', '2024'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '土壤肥力',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [120, 132, 101, 100, 90, 230, 210],
|
||||
color: 'rgb(80,135,236)',
|
||||
},
|
||||
{
|
||||
name: '酸碱度',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [100, 101, 191, 234, 290, 158, 259],
|
||||
color: 'rgb(104,187,196)',
|
||||
},
|
||||
{
|
||||
name: '重金属含量',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [150, 232, 201, 154, 190, 200, 250],
|
||||
color: 'rgb(88,165,92)',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const marketOption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '市场价格波动',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
legend: {
|
||||
data: ['土豆', '花生', '水稻', '西红柿', '玉米'],
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
saveAsImage: {},
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['2020', '2021', '2022', '2023', '2024'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '土豆',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [120, 132, 101, 100, 90, 230, 210],
|
||||
color: 'rgb(80,135,236)',
|
||||
},
|
||||
{
|
||||
name: '花生',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [100, 101, 191, 234, 290, 158, 259],
|
||||
color: 'rgb(104,187,196)',
|
||||
},
|
||||
{
|
||||
name: '水稻',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [150, 232, 201, 154, 190, 200, 250],
|
||||
color: 'rgb(88,165,92)',
|
||||
},
|
||||
{
|
||||
name: '西红柿',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [128, 156, 180, 60, 190, 157, 169],
|
||||
color: 'rgb(242,189,66)',
|
||||
},
|
||||
{
|
||||
name: '玉米',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
data: [100, 232, 201, 154, 190, 330, 200],
|
||||
color: 'rgb(238,117,47)',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const profitOption = {
|
||||
title: {
|
||||
text: '成本收益分析',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
},
|
||||
legend: {},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: ['2021', '2022', '2023', '2024', '2025'],
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '',
|
||||
min: 0,
|
||||
max: 250,
|
||||
interval: 50,
|
||||
axisLabel: {
|
||||
formatter: '{value}',
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: '利润',
|
||||
min: 0,
|
||||
max: 25,
|
||||
interval: 5,
|
||||
axisLabel: {
|
||||
formatter: '{value} %',
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '成本',
|
||||
type: 'bar',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
data: [320, 332, 301, 334, 390, 330, 320],
|
||||
},
|
||||
{
|
||||
name: '收入',
|
||||
type: 'bar',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
data: [120, 132, 101, 134, 90, 230, 210],
|
||||
},
|
||||
{
|
||||
name: '利润',
|
||||
type: 'line',
|
||||
barWidth: '12px',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + ' %';
|
||||
},
|
||||
},
|
||||
data: [60, 60, 30, 40, 60, 50, 80],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
environmentOption && environmentChart.setOption(environmentOption);
|
||||
marketOption && marketChart.setOption(marketOption);
|
||||
profitOption && profitChart.setOption(profitOption);
|
||||
});
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@ -1,187 +0,0 @@
|
||||
<template>
|
||||
<section>土地利用与规划分析</section>
|
||||
<div>
|
||||
<el-row :gutter="20" style="margin: 16px 0">
|
||||
<el-col :span="12">
|
||||
<el-card>
|
||||
<div ref="planUsed" style="width: 100%; height: 300px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card>
|
||||
<div ref="cropStructure" style="width: 100%; height: 300px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="24" style="margin: 16px 0">
|
||||
<el-card>
|
||||
<div ref="changeTrend" style="width: 100%; height: 300px"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, onMounted } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
const planUsed = ref(null);
|
||||
const cropStructure = ref(null);
|
||||
const changeTrend = ref(null);
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
|
||||
onMounted(() => {
|
||||
const planUsedChart = echarts.init(planUsed.value);
|
||||
const cropStructureChart = echarts.init(cropStructure.value);
|
||||
const changeTrendChart = echarts.init(changeTrend.value);
|
||||
|
||||
const planUsedoption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '土地用途分析',
|
||||
subtext: '',
|
||||
left: 'left',
|
||||
top: '0px',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
},
|
||||
legend: {
|
||||
orient: 'horizontal',
|
||||
left: 'center',
|
||||
top: '10%',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '占比',
|
||||
type: 'pie',
|
||||
radius: '50%',
|
||||
center: ['50%', '60%'],
|
||||
data: [
|
||||
{ value: 1048, name: '耕地', itemStyle: { color: 'rgb(88,165,92)' } },
|
||||
{ value: 735, name: '林地', itemStyle: { color: 'rgb(80,135,236)' } },
|
||||
{ value: 580, name: '建设用地', itemStyle: { color: 'rgb(104,187,196)' } },
|
||||
],
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const cropStructureoption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '作物种植结构',
|
||||
subtext: '',
|
||||
left: 'left',
|
||||
top: '0px',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
},
|
||||
legend: {
|
||||
orient: 'horizontal',
|
||||
left: 'center',
|
||||
top: '10%',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '占比',
|
||||
type: 'pie',
|
||||
radius: '50%',
|
||||
center: ['50%', '60%'],
|
||||
data: [
|
||||
{ value: 1048, name: '土豆', itemStyle: { color: 'rgb(80,135,236)' } },
|
||||
{ value: 735, name: '西红柿', itemStyle: { color: 'rgb(104,187,196)' } },
|
||||
{ value: 580, name: '玉米', itemStyle: { color: 'rgb(88,165,92)' } },
|
||||
{ value: 580, name: '花生', itemStyle: { color: 'rgb(242,189,66)' } },
|
||||
{ value: 580, name: '水稻', itemStyle: { color: 'rgb(238,117,47)' } },
|
||||
],
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const changeTrendoption = {
|
||||
// color: ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae'], // 全局颜色列表
|
||||
title: {
|
||||
text: '土地变更趋势',
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
legend: {
|
||||
data: ['耕地', '林地', '建设用地'],
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
toolbox: {
|
||||
feature: {
|
||||
saveAsImage: {},
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['2020', '2021', '2022', '2023', '2024'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '耕地',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
mooth: true,
|
||||
data: [120, 132, 101, 134, 90, 230, 210],
|
||||
color: 'rgb(80,135,236)',
|
||||
},
|
||||
{
|
||||
name: '林地',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
mooth: true,
|
||||
data: [220, 182, 191, 234, 290, 330, 310],
|
||||
color: 'rgb(104,187,196)',
|
||||
},
|
||||
{
|
||||
name: '建设用地',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
mooth: true,
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
color: 'rgb(88,165,92)',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
planUsedoption && planUsedChart.setOption(planUsedoption);
|
||||
cropStructureoption && cropStructureChart.setOption(cropStructureoption);
|
||||
changeTrendoption && changeTrendChart.setOption(changeTrendoption);
|
||||
});
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@ -1,19 +0,0 @@
|
||||
<template>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@ -89,6 +89,7 @@ const state = reactive({
|
||||
{
|
||||
label: '溯源码',
|
||||
prop: 'id',
|
||||
width: 200,
|
||||
search: true,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user