Web/daimp-front
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Web:93378aa67b0bdcf3a94471640bafc83272a09d35
Branches Tags
Web:master
Web:dev
Web:修改登录-勿用
...
compare: Web:6d7acfeaf255c47b463500e94b31fa33b55ff3ab
Branches Tags
Web:dev
Web:修改登录-勿用
Web:master

3 Commits
93378aa67b ... 6d7acfeaf2

Author SHA1 Message Date
沈鸿
6d7acfeaf2 commit 2025-06-24 11:36:13 +08:00
沈鸿
40169c27fe Merge branch 'dev' of http://47.109.205.240:3000/Web/daimp-front into dev 2025-06-24 10:38:40 +08:00
沈鸿
b58c65ae4d commit 2025-06-24 10:35:37 +08:00
16 changed files with 496 additions and 675 deletions
Show Stats Expand all files Collapse all files

89
package-lock.json generated
View File

@ -9,10 +9,6 @@
"version": "1.0.0",
"hasInstallScript": true,
"license": "MIT",
"dependencies": {
"vue-demi": "^0.14.10",
"vue-tianditu": "^2.7.6"
},
"devDependencies": {
"npm-run-all": "^4.1.5"
}
@ -1165,12 +1161,6 @@
"node": "*"
}
},
"node_modules/mitt": {
"version": "3.0.1",
"resolved": "https://registry.npmmirror.com/mitt/-/mitt-3.0.1.tgz",
"integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
"license": "MIT"
},
"node_modules/nice-try": {
"version": "1.0.5",
"resolved": "https://registry.npmmirror.com/nice-try/-/nice-try-1.0.5.tgz",
@ -1920,85 +1910,6 @@
"spdx-expression-parse": "^3.0.0"
}
},
"node_modules/vue": {
"version": "2.6.14",
"resolved": "https://registry.npmmirror.com/vue/-/vue-2.6.14.tgz",
"integrity": "sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ==",
"deprecated": "Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.",
"license": "MIT",
"peer": true
},
"node_modules/vue-demi": {
"version": "0.14.10",
"resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz",
"integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
"hasInstallScript": true,
"license": "MIT",
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^3.0.0-0 || ^2.6.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/vue-tianditu": {
"version": "2.7.6",
"resolved": "https://registry.npmmirror.com/vue-tianditu/-/vue-tianditu-2.7.6.tgz",
"integrity": "sha512-Yvcxg0IAgGB3ZY8zlC5ayjo9f85fa8PFTaifguTNpri76g67GO9toaRWMjBKi39yYHMBADaT3P6bEkJx87X8MQ==",
"license": "MIT",
"dependencies": {
"mitt": "^3.0.0",
"vue-demi": "^0.12.1"
},
"peerDependencies": {
"@vue/composition-api": "^1.4.2",
"vue": "^2.0.0 || >=3.0.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/vue-tianditu/node_modules/vue-demi": {
"version": "0.12.5",
"resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.12.5.tgz",
"integrity": "sha512-BREuTgTYlUr0zw0EZn3hnhC3I6gPWv+Kwh4MCih6QcAeaTlaIX0DwOVN0wHej7hSvDPecz4jygy/idsgKfW58Q==",
"hasInstallScript": true,
"license": "MIT",
"bin": {
"vue-demi-fix": "bin/vue-demi-fix.js",
"vue-demi-switch": "bin/vue-demi-switch.js"
},
"engines": {
"node": ">=12"
},
"funding": {
"url": "https://github.com/sponsors/antfu"
},
"peerDependencies": {
"@vue/composition-api": "^1.0.0-rc.1",
"vue": "^3.0.0-0 || ^2.6.0"
},
"peerDependenciesMeta": {
"@vue/composition-api": {
"optional": true
}
}
},
"node_modules/which": {
"version": "1.3.1",
"resolved": "https://registry.npmmirror.com/which/-/which-1.3.1.tgz",

5
package.json
View File

@ -34,10 +34,7 @@
],
"author": "",
"license": "MIT",
"dependencies": {
"vue-demi": "^0.14.10",
"vue-tianditu": "^2.7.6"
},
"dependencies": {},
"devDependencies": {
"npm-run-all": "^4.1.5"
}

75
sub-government-affairs-service/auto-imports.d.ts vendored
View File

@ -1,75 +0,0 @@
/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// noinspection JSUnusedGlobalSymbols
// Generated by unplugin-auto-import
export {}
declare global {
const EffectScope: typeof import('vue')['EffectScope']
const computed: typeof import('vue')['computed']
const createApp: typeof import('vue')['createApp']
const customRef: typeof import('vue')['customRef']
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
const defineComponent: typeof import('vue')['defineComponent']
const effectScope: typeof import('vue')['effectScope']
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
const getCurrentScope: typeof import('vue')['getCurrentScope']
const h: typeof import('vue')['h']
const inject: typeof import('vue')['inject']
const isProxy: typeof import('vue')['isProxy']
const isReactive: typeof import('vue')['isReactive']
const isReadonly: typeof import('vue')['isReadonly']
const isRef: typeof import('vue')['isRef']
const markRaw: typeof import('vue')['markRaw']
const nextTick: typeof import('vue')['nextTick']
const onActivated: typeof import('vue')['onActivated']
const onBeforeMount: typeof import('vue')['onBeforeMount']
const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
const onDeactivated: typeof import('vue')['onDeactivated']
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
const onMounted: typeof import('vue')['onMounted']
const onRenderTracked: typeof import('vue')['onRenderTracked']
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
const onScopeDispose: typeof import('vue')['onScopeDispose']
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
const onUnmounted: typeof import('vue')['onUnmounted']
const onUpdated: typeof import('vue')['onUpdated']
const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
const provide: typeof import('vue')['provide']
const reactive: typeof import('vue')['reactive']
const readonly: typeof import('vue')['readonly']
const ref: typeof import('vue')['ref']
const resolveComponent: typeof import('vue')['resolveComponent']
const shallowReactive: typeof import('vue')['shallowReactive']
const shallowReadonly: typeof import('vue')['shallowReadonly']
const shallowRef: typeof import('vue')['shallowRef']
const toRaw: typeof import('vue')['toRaw']
const toRef: typeof import('vue')['toRef']
const toRefs: typeof import('vue')['toRefs']
const toValue: typeof import('vue')['toValue']
const triggerRef: typeof import('vue')['triggerRef']
const unref: typeof import('vue')['unref']
const useAttrs: typeof import('vue')['useAttrs']
const useCssModule: typeof import('vue')['useCssModule']
const useCssVars: typeof import('vue')['useCssVars']
const useId: typeof import('vue')['useId']
const useLink: typeof import('vue-router')['useLink']
const useModel: typeof import('vue')['useModel']
const useRoute: typeof import('vue-router')['useRoute']
const useRouter: typeof import('vue-router')['useRouter']
const useSlots: typeof import('vue')['useSlots']
const useTemplateRef: typeof import('vue')['useTemplateRef']
const watch: typeof import('vue')['watch']
const watchEffect: typeof import('vue')['watchEffect']
const watchPostEffect: typeof import('vue')['watchPostEffect']
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
}
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
import('vue')
}

2
sub-government-affairs-service/src/apis/inputSuppliesApi/material.js
View File

@ -84,7 +84,7 @@ export function delAnimalMedicine(ids) {
// #region
/* 查询种源 */
export function getSeedList(params) {
return request('/inputGoods/provenance/page', {
return request('/inputGoods/supervise/provenance/page', {
params,
});
}

BIN
sub-government-affairs-service/src/assets/images/input/inputman.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 472 KiB

60
sub-government-affairs-service/src/router/modules/inputSupplies/index.js
View File

@ -27,42 +27,42 @@ const inputSuppliesRoutes = [
component: () => import('@/views/inputSuppliesManage/material/annualPlan/index.vue'),
meta: { title: '农产品种植计划管理', icon: 'Timer' },
},
{
path: '/sub-government-affairs-service/material/seed',
name: 'input-supplies-seed',
component: () => import('@/views/inputSuppliesManage/material/seed/index.vue'),
meta: { title: '种子种苗管理', icon: 'Watermelon' },
},
{
path: '/sub-government-affairs-service/material/fertilizer',
name: 'input-supplies-fertilizer',
component: () => import('@/views/inputSuppliesManage/material/fertilizer/index.vue'),
meta: { title: '肥料管理', icon: 'Grid' },
},
{
path: '/sub-government-affairs-service/material/pesticide',
name: 'input-supplies-pesticide',
component: () => import('@/views/inputSuppliesManage/material/pesticide/index.vue'),
meta: { title: '农药管理', icon: 'Orange' },
},
{
path: '/sub-government-affairs-service/material/others',
name: 'input-supplies-others',
component: () => import('@/views/inputSuppliesManage/material/others/index.vue'),
meta: { title: '其他投入品管理', icon: 'TakeawayBox' },
},
// {
// path: '/sub-government-affairs-service/material/seed',
// name: 'input-supplies-seed',
// component: () => import('@/views/inputSuppliesManage/material/seed/index.vue'),
// meta: { title: '种子种苗管理', icon: 'Watermelon' },
// },
// {
// path: '/sub-government-affairs-service/material/fertilizer',
// name: 'input-supplies-fertilizer',
// component: () => import('@/views/inputSuppliesManage/material/fertilizer/index.vue'),
// meta: { title: '肥料管理', icon: 'Grid' },
// },
// {
// path: '/sub-government-affairs-service/material/pesticide',
// name: 'input-supplies-pesticide',
// component: () => import('@/views/inputSuppliesManage/material/pesticide/index.vue'),
// meta: { title: '农药管理', icon: 'Orange' },
// },
// {
// path: '/sub-government-affairs-service/material/others',
// name: 'input-supplies-others',
// component: () => import('@/views/inputSuppliesManage/material/others/index.vue'),
// meta: { title: '其他投入品管理', icon: 'TakeawayBox' },
// },
{
path: '/sub-government-affairs-service/supervisionOfInputs ',
name: 'supervisionOfInputs',
redirect: '/sub-government-affairs-service/supervisionOfInputs/seedRegulation',
meta: { title: '投入品使用监管', icon: 'Connection' },
children: [
// {
// path: '/sub-government-affairs-service/supervisionOfInputs/regulatoryOverview',
// name: 'regulatoryOverview',
// component: () => import('@/views/inputSuppliesManage/supervisionOfInputs/regulatoryOverview.vue'),
// meta: { title: '使用监管概览', icon: '' },
// },
{
path: '/sub-government-affairs-service/statistics',
name: 'Statistics',
component: () => import('@/views/planting-management/statistics/index.vue'),
meta: { title: '使用监管概况统计', icon: '' },
},
{
path: '/sub-government-affairs-service/supervisionOfInputs/seedRegulation',
name: 'seedRegulation',

6
sub-government-affairs-service/src/views/inputSuppliesManage/material/pesticide/index.vue
View File

@ -199,14 +199,14 @@ const tableLoading = ref(false);
const tableTotal = ref(0);
const columns = ref([
// { prop: "id", label: "ID" },
{ prop: 'name', label: '类别名称' },
{ prop: 'name', label: '姓名' },
{ prop: 'phone', label: '联系方式' },
{ prop: 'landName', label: '用药地块' },
{ prop: 'detectionTime', label: '检测时间' },
{ prop: 'detectionResult', label: '检测结果' },
{ prop: 'detectionUnit', label: '检测单位' },
// { prop: 'status', label: '检测报告(是否上传)' },
{ prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
{ prop: 'isUpload', label: '检测报告(是否上传)' },
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
]);
const handlePaginationChange = ({ page, pageSize }) => {
formInline.current = page;

40
sub-government-affairs-service/src/views/inputSuppliesManage/material/seed/index.vue
View File

@ -38,11 +38,11 @@
@page-change="handlePaginationChange"
>
<!-- 自定义-操作 -->
<template #action="slotProps">
<!-- <el-button type="primary" @click="seeDetails(slotProps.row)">查看</el-button> -->
<!-- <el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button> -->
<!-- <template #action="slotProps">
<el-button type="primary" @click="seeDetails(slotProps.row)">查看</el-button>
<el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button>
<el-button @click="handleDelete(slotProps.row)">删除</el-button>
</template>
</template> -->
</tableComponent>
</div>
</div>
@ -136,14 +136,30 @@ const selectedIds = ref([]);
const tableLoading = ref(false);
const tableTotal = ref(0);
const columns = ref([
{ prop: 'id', label: '编码' },
{ prop: 'seedName', label: '种子种苗名称' },
{ prop: 'varietyName', label: '品种名称' },
{ prop: 'brand', label: '品牌' },
{ prop: 'manufacturer', label: '生产厂家' },
{ prop: 'classifyName', label: '分类' },
{ prop: 'productUnit', label: '产品规格' },
{ prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
// 行政区划编码
{ prop: 'regionCode', label: '行政区划编码' },
// 行政区划名称
{ prop: 'regionCode', label: '行政区划名称' },
// 网格编码
{ prop: 'gridId', label: '网格编码' },
// 网格名称
{ prop: 'gridName', label: '网格名称' },
// 地块编号
{ prop: 'landId', label: '地块编号' },
// 地块名称
{ prop: 'landName', label: '地块名称' },
// 种子编号
{ prop: 'provenanceId', label: '种子编号' },
{ prop: 'provenanceName', label: '种子种苗名称' },
// 使用量
{ prop: 'useNumber', label: '使用量' },
// 使用时间
{ prop: 'useTime', label: '使用时间' },
// 生成经营主体编码
{ prop: 'businessEntityCode', label: '生成经营主体编码' },
// 生产经营主体名称
{ prop: 'businessEntityName', label: '生产经营主体名称' },
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
]);
const handlePaginationChange = ({ page, pageSize }) => {
formInline.current = page;

2
sub-government-affairs-service/src/views/planting-management/statistics/index.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="custom-page" :style="`background-image: url(${getAssetsFile('images/landBase/land2.png')})`">
<div class="custom-page" :style="`background-image: url(${getAssetsFile('images/input/inputman.png')})`">
<!-- <h1>统计数据</h1>
<div class="content"></div> -->
</div>

10
sub-government-affairs-service/src/views/planting-management/variety-record/components/RecordPage.vue
View File

@ -3,9 +3,9 @@
<SearchBar v-model:search="searchForm" @search="handleSearch" @reset="handleReset" />
<el-tabs v-model="activeTab" @tab-click="handleTabChange">
<!-- <el-tab-pane label="待提交" name="-1" /> -->
<el-tab-pane label="待审核" name="0" />
<el-tab-pane label="已通过" name="1" />
<el-tab-pane label="已驳回" name="2" />
<el-tab-pane label="待审核" name="1" />
<el-tab-pane label="已通过" name="2" />
<el-tab-pane label="已驳回" name="3" />
</el-tabs>
<avue-crud
ref="crudRef"
@ -16,9 +16,9 @@
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
>
<template #menu="scope">
<!-- <template #menu="scope">
<custom-table-operate :actions="getActions(scope.row)" :data="scope" />
</template>
</template> -->
</avue-crud>
<el-dialog v-model="visible" title="查看" width="60%" align-center :draggable="true">
<RecordForm ref="formRef" v-model="formData" :disabled="mode === 'view'" />

10
sub-government-affairs-service/src/views/productOperateMain/coOp/index.vue
View File

@ -178,14 +178,14 @@ const crudOptions = reactive({
{ label: '企业负责人', prop: 'contactPerson' },
{ label: '联系方式', prop: 'phone' },
{ label: '企业地址', prop: 'address' },
{ label: '地块数量', prop: 'villageCount' },
{ label: '地块编号', prop: 'villageCode' },
{ label: '地块名称', prop: 'villageName' },
{ label: '地块数量', prop: 'landCount' },
{ label: '地块编号', prop: 'landCount' },
{ label: '地块名称', prop: 'landName' },
{ label: '面积', prop: 'area', formatter: (row, column, cellValue) => `${Number(cellValue).toFixed(2)} 亩` },
{ label: '所属行政区划', prop: 'address' },
{ label: '所属网格', prop: 'gridCode' },
{ label: '种植作物', prop: 'primaryProduct' },
{ label: '账号（手机号）', prop: 'account' },
{ label: '种植作物', prop: 'planCrop' },
{ label: '账号（手机号）', prop: 'phone' },
{ label: '信息录入时间', prop: 'createTime' },
{ label: '信息更新时间', prop: 'updateTime' },
],

8
sub-government-affairs-service/src/views/productOperateMain/individual/index.vue
View File

@ -208,14 +208,14 @@ const crudOptions = reactive({
{ label: '联系方式', prop: 'phone' },
// 地址
{ label: '地址', prop: 'address', width: '300px' },
{ label: '地块数量', prop: 'villageCount' },
{ label: '地块编号', prop: 'villageCode' },
{ label: '地块名称', prop: 'villageName' },
{ label: '地块数量', prop: 'landCount' },
{ label: '地块编号', prop: 'landNumber' },
{ label: '地块名称', prop: 'landName' },
{ label: '面积', prop: 'area', formatter: (row, column, cellValue) => `${Number(cellValue).toFixed(2)} 亩` },
{ label: '所属行政区划', prop: 'address' },
{ label: '所属网格', prop: 'gridCode' },
{ label: '种植作物', prop: 'planCropName' },
{ label: '账号（手机号）', prop: 'account' },
{ label: '账号（手机号）', prop: 'phone' },
{ label: '创建时间', prop: 'createTime' },
{ label: '更新时间', prop: 'updateTime' },
],

412
sub-government-affairs-service/src/views/resource/database/LandMap.vue
View File

@ -1,401 +1,47 @@
<template>
<div class="field-management">
<!-- 左侧面板 -->
<div class="panel left">
<el-input v-model="searchTerm" placeholder="搜索地块名称" clearable style="margin-bottom: 15px"></el-input>
<el-table :data="filteredFields" highlight-current-row style="width: 100%" height="calc(100vh - 300px)" @row-click="selectField">
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="area" label="面积(㎡)">
<template #default="{ row }">
{{ row.area.toFixed(2) }}
</template>
</el-table-column>
</el-table>
<div class="stats">总面积: {{ totalArea.toFixed(2) }} ㎡</div>
<div class="button-group">
<el-button type="primary" @click="startDrawing">新增地块</el-button>
<el-button type="danger" :disabled="!selectedField" @click="removeField">删除地块</el-button>
</div>
</div>
<!-- 右侧地图区域 -->
<div class="panel right">
<tdt-map class="map" :center="mapCenter" :zoom="mapZoom" @init="onMapInit"> </tdt-map>
<div class="layer-switch">
<el-radio-group v-model="layerType" size="small" @change="changeBaseLayer">
<el-radio-button label="vector">矢量</el-radio-button>
<el-radio-button label="image">影像</el-radio-button>
</el-radio-group>
</div>
<div class="field-layer-switch">
<el-switch v-model="showFieldLayer" active-text="显示地块"></el-switch>
</div>
<div class="zoom-scale">缩放级别: {{ mapZoom }}, 比例尺: 1:{{ scale.toLocaleString() }}</div>
<el-dialog v-model="drawDialogVisible" title="新增地块">
<el-form>
<el-form-item label="地块名称">
<el-input v-model="newFieldName"></el-input>
</el-form-item>
<el-form-item label="地块面积">
<el-input :value="newFieldArea.toFixed(2) + ' ㎡'" readonly></el-input>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="cancelDrawing">取消</el-button>
<el-button type="primary" @click="saveNewField">保存</el-button>
</template>
</el-dialog>
</div>
<div class="mapDiv">
<tdt-map ref="tdtMapRef" :center="state.center" :zoom="state.zoom" :style="{ height: mapHeight }">
<!-- <tdt-tile-layer :layer-type="'img_w'"></tdt-tile-layer> -->
<!-- <tdt-tile-layer :layer-type="'cia_w'" :z-index="2"></tdt-tile-layer> -->
<tdt-tilelayer :url="state.img_w_url" :z-index="1"></tdt-tilelayer>
<tdt-tilelayer :url="state.cia_w_url" :z-index="2"></tdt-tilelayer>
</tdt-map>
</div>
</template>
<script setup>
import { ref, computed, onMounted, watch } from 'vue';
import { TdtMap } from 'vue-tianditu';
import { ElMessage } from 'element-plus';
// import { map_config } from '../../config/map';
import { reactive, onMounted, ref } from 'vue';
import { TdtMap, TdtTileLayer } from 'vue-tianditu';
import { map_config } from '@/config/map';
// 模拟接口服务（使用localStorage）
const fieldService = {
getFields() {
const fields = localStorage.getItem('fields');
return Promise.resolve(fields ? JSON.parse(fields) : []);
},
createField(field) {
return this.getFields().then((fields) => {
field.id = Date.now();
fields.push(field);
localStorage.setItem('fields', JSON.stringify(fields));
return field;
});
},
deleteField(id) {
return this.getFields().then((fields) => {
const newFields = fields.filter((f) => f.id !== id);
localStorage.setItem('fields', JSON.stringify(newFields));
return newFields;
});
},
};
const key = map_config.tianditu.token;
// 响应式状态
const fields = ref([]);
const selectedField = ref(null);
const searchTerm = ref('');
const newFieldName = ref('');
const drawDialogVisible = ref(false);
const newFieldCoords = ref([]);
const newFieldArea = ref(0);
const layerType = ref('vector');
const showFieldLayer = ref(true);
const map = ref(null);
const mapCenter = ref([100.088, 23.883]);
const mapZoom = ref(12);
const scale = ref(0);
// 天地图图层
const baseLayers = {
vector: null,
vectorLabel: null,
image: null,
imageLabel: null,
};
// 覆盖物图层
const overlayLayer = ref(null);
// 计算属性
const filteredFields = computed(() => {
const term = searchTerm.value.toLowerCase();
return term ? fields.value.filter((f) => f.name.toLowerCase().includes(term)) : fields.value;
const state = reactive({
center: [100.088, 23.883],
zoom: 14,
img_w_url: `http://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${key}`,
cia_w_url: `http://t0.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${key}`,
// 添加其他地图层URL
// ...
});
const totalArea = computed(() => {
return fields.value.reduce((sum, field) => sum + field.area, 0);
});
// 确保地图有明确的高度
const mapHeight = ref('100vh');
// 地图初始化
const onMapInit = (mapInstance) => {
map.value = mapInstance;
// 创建图层
baseLayers.vector = new T.TileLayer('vec');
baseLayers.vectorLabel = new T.TileLayer('cva');
baseLayers.image = new T.TileLayer('img');
baseLayers.imageLabel = new T.TileLayer('cia');
// 添加默认图层
map.value.addLayer(baseLayers.image);
map.value.addLayer(baseLayers.imageLabel);
// 创建覆盖物图层
overlayLayer.value = new T.Map.OverlayLayer();
map.value.addLayer(overlayLayer.value);
// 添加控件
map.value.addControl(new T.Control.Zoom());
map.value.addControl(new T.Control.Scale());
// 事件监听
map.value.addEventListener('zoomend', updateScale);
map.value.addEventListener('moveend', updateScale);
// 初始加载数据
loadFields();
};
// 更新比例尺
const updateScale = () => {
if (map.value) {
mapZoom.value = map.value.getZoom();
scale.value = Math.round(map.value.getScale());
}
};
// 切换底图
const changeBaseLayer = () => {
if (!map.value) return;
// 移除当前底图
map.value.removeLayer(baseLayers.vector);
map.value.removeLayer(baseLayers.vectorLabel);
map.value.removeLayer(baseLayers.image);
map.value.removeLayer(baseLayers.imageLabel);
// 添加新底图
if (layerType.value === 'vector') {
map.value.addLayer(baseLayers.vector);
map.value.addLayer(baseLayers.vectorLabel);
onMounted(() => {
console.log('地图组件已挂载');
// 检查天地图API是否加载成功
if (window.T) {
console.log('天地图API已加载:', window.T);
} else {
map.value.addLayer(baseLayers.image);
map.value.addLayer(baseLayers.imageLabel);
console.error('天地图API未加载');
}
};
// 加载地块数据
const loadFields = () => {
fieldService.getFields().then((data) => {
fields.value = data;
refreshOverlays();
});
};
// 刷新覆盖物
const refreshOverlays = () => {
if (!map.value || !overlayLayer.value) return;
// 清除所有覆盖物
overlayLayer.value.clearOverLays();
// 如果不显示地块图层则跳过绘制
if (!showFieldLayer.value) return;
// 绘制所有地块
fields.value.forEach((field) => {
const isSelected = selectedField.value?.id === field.id;
const polygon = createPolygon(field, isSelected);
overlayLayer.value.addOverLay(polygon);
});
};
// 创建多边形
const createPolygon = (field, isSelected = false) => {
const coords = field.geometry.coordinates[0].map((c) => new T.LngLat(c[0], c[1]));
return new T.Polygon(coords, {
color: isSelected ? '#ff0000' : '#1890ff',
weight: isSelected ? 3 : 2,
opacity: 0.8,
fillColor: isSelected ? '#ffa39e' : '#e6f7ff',
fillOpacity: 0.5,
});
};
// 选择地块
const selectField = (field) => {
selectedField.value = field;
refreshOverlays();
// 居中显示选中地块
if (map.value) {
const coords = field.geometry.coordinates[0];
const center = coords.reduce(
(acc, coord) => {
acc[0] += coord[0];
acc[1] += coord[1];
return acc;
},
[0, 0]
);
center[0] /= coords.length;
center[1] /= coords.length;
map.value.panTo(new T.LngLat(center[0], center[1]));
}
};
// 开始绘制
const startDrawing = () => {
if (!map.value) return;
// 清除当前覆盖物
refreshOverlays();
// 创建绘制工具
const polygonTool = new T.PolygonTool(map.value, {
showLabel: true,
color: '#fa541c',
weight: 3,
opacity: 0.6,
fillColor: '#ffbb96',
fillOpacity: 0.4,
});
polygonTool.open();
// 绘制完成事件
polygonTool.addEventListener('draw', (e) => {
newFieldCoords.value = e.currentLnglats.map((lnglat) => [lnglat.lng, lnglat.lat]);
newFieldArea.value = e.currentArea;
drawDialogVisible.value = true;
// 清除临时图形
polygonTool.close();
});
};
// 保存新地块
const saveNewField = () => {
if (!newFieldName.value.trim()) {
ElMessage.error('请输入地块名称');
return;
}
const newField = {
id: Date.now(),
name: newFieldName.value,
area: newFieldArea.value,
geometry: {
type: 'Polygon',
coordinates: [newFieldCoords.value],
},
};
fieldService.createField(newField).then(() => {
ElMessage.success('地块创建成功');
drawDialogVisible.value = false;
newFieldName.value = '';
loadFields();
});
};
// 取消绘制
const cancelDrawing = () => {
drawDialogVisible.value = false;
refreshOverlays();
};
// 删除地块
const removeField = () => {
if (!selectedField.value) return;
fieldService.deleteField(selectedField.value.id).then(() => {
ElMessage.success('地块已删除');
selectedField.value = null;
loadFields();
});
};
// 监听地块图层显示状态
watch(showFieldLayer, refreshOverlays);
});
</script>
<style scoped>
.field-management {
display: flex;
height: calc(100vh - 160px);
}
.panel.left {
width: 320px;
padding: 15px;
border-right: 1px solid #e4e7ed;
display: flex;
flex-direction: column;
background: #f8fafc;
}
.panel.right {
flex: 1;
position: relative;
}
.map {
.mapDiv {
width: 100%;
height: 100%;
}
.layer-switch {
position: absolute;
top: 15px;
right: 15px;
background: white;
padding: 8px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
}
.field-layer-switch {
position: absolute;
top: 60px;
right: 15px;
background: white;
padding: 8px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
display: flex;
align-items: center;
gap: 8px;
}
.zoom-scale {
position: absolute;
bottom: 15px;
left: 50%;
transform: translateX(-50%);
background: rgba(255, 255, 255, 0.85);
padding: 6px 12px;
border-radius: 4px;
font-size: 14px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
}
.stats {
padding: 12px;
margin: 10px 0;
background: #edf2ff;
border-radius: 4px;
font-weight: 500;
color: #364fc7;
}
.button-group {
display: flex;
gap: 10px;
margin-top: 10px;
}
.button-group > * {
flex: 1;
height: 100vh; /* 确保容器有明确高度 */
}
</style>

414
sub-government-affairs-service/src/views/resource/database/LandMapBak.vue
View File

@ -1,47 +1,401 @@
<template>
<div class="mapDiv">
<tdt-map ref="tdtMapRef" :center="state.center" :zoom="state.zoom" :style="{ height: mapHeight }">
<!-- <tdt-tile-layer :layer-type="'img_w'"></tdt-tile-layer> -->
<!-- <tdt-tile-layer :layer-type="'cia_w'" :z-index="2"></tdt-tile-layer> -->
<tdt-tilelayer :url="state.img_w_url" :z-index="1"></tdt-tilelayer>
<tdt-tilelayer :url="state.cia_w_url" :z-index="2"></tdt-tilelayer>
</tdt-map>
<div class="field-management">
<!-- 左侧面板 -->
<div class="panel left">
<el-input v-model="searchTerm" placeholder="搜索地块名称" clearable style="margin-bottom: 15px"></el-input>
<el-table :data="filteredFields" highlight-current-row style="width: 100%" height="calc(100vh - 300px)" @row-click="selectField">
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="area" label="面积(㎡)">
<template #default="{ row }">
{{ row.area.toFixed(2) }}
</template>
</el-table-column>
</el-table>
<div class="stats">总面积: {{ totalArea.toFixed(2) }} ㎡</div>
<div class="button-group">
<el-button type="primary" @click="startDrawing">新增地块</el-button>
<el-button type="danger" :disabled="!selectedField" @click="removeField">删除地块</el-button>
</div>
</div>
<!-- 右侧地图区域 -->
<div class="panel right">
<tdt-map class="map" :center="mapCenter" :zoom="mapZoom" @init="onMapInit"> </tdt-map>
<div class="layer-switch">
<el-radio-group v-model="layerType" size="small" @change="changeBaseLayer">
<el-radio-button label="vector">矢量</el-radio-button>
<el-radio-button label="image">影像</el-radio-button>
</el-radio-group>
</div>
<div class="field-layer-switch">
<el-switch v-model="showFieldLayer" active-text="显示地块"></el-switch>
</div>
<div class="zoom-scale">缩放级别: {{ mapZoom }}, 比例尺: 1:{{ scale.toLocaleString() }}</div>
<el-dialog v-model="drawDialogVisible" title="新增地块">
<el-form>
<el-form-item label="地块名称">
<el-input v-model="newFieldName"></el-input>
</el-form-item>
<el-form-item label="地块面积">
<el-input :value="newFieldArea.toFixed(2) + ' ㎡'" readonly></el-input>
</el-form-item>
</el-form>
<template #footer>
<el-button @click="cancelDrawing">取消</el-button>
<el-button type="primary" @click="saveNewField">保存</el-button>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup>
import { reactive, onMounted, ref } from 'vue';
import { TdtMap, TdtTileLayer } from 'vue-tianditu';
import { map_config } from '@/config/map';
import { ref, computed, onMounted, watch } from 'vue';
import { TdtMap } from 'vue-tianditu';
import { ElMessage } from 'element-plus';
// import { map_config } from '../../config/map';
const key = map_config.tianditu.token;
// 模拟接口服务（使用localStorage）
const fieldService = {
getFields() {
const fields = localStorage.getItem('fields');
return Promise.resolve(fields ? JSON.parse(fields) : []);
},
createField(field) {
return this.getFields().then((fields) => {
field.id = Date.now();
fields.push(field);
localStorage.setItem('fields', JSON.stringify(fields));
return field;
});
},
deleteField(id) {
return this.getFields().then((fields) => {
const newFields = fields.filter((f) => f.id !== id);
localStorage.setItem('fields', JSON.stringify(newFields));
return newFields;
});
},
};
const state = reactive({
center: [100.088, 23.883],
zoom: 14,
img_w_url: `http://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${key}`,
cia_w_url: `http://t0.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${key}`,
// 添加其他地图层URL
// ...
// 响应式状态
const fields = ref([]);
const selectedField = ref(null);
const searchTerm = ref('');
const newFieldName = ref('');
const drawDialogVisible = ref(false);
const newFieldCoords = ref([]);
const newFieldArea = ref(0);
const layerType = ref('vector');
const showFieldLayer = ref(true);
const map = ref(null);
const mapCenter = ref([100.088, 23.883]);
const mapZoom = ref(12);
const scale = ref(0);
// 天地图图层
const baseLayers = {
vector: null,
vectorLabel: null,
image: null,
imageLabel: null,
};
// 覆盖物图层
const overlayLayer = ref(null);
// 计算属性
const filteredFields = computed(() => {
const term = searchTerm.value.toLowerCase();
return term ? fields.value.filter((f) => f.name.toLowerCase().includes(term)) : fields.value;
});
// 确保地图有明确的高度
const mapHeight = ref('100vh');
const totalArea = computed(() => {
return fields.value.reduce((sum, field) => sum + field.area, 0);
});
onMounted(() => {
console.log('地图组件已挂载');
// 检查天地图API是否加载成功
if (window.T) {
console.log('天地图API已加载:', window.T);
} else {
console.error('天地图API未加载');
// 地图初始化
const onMapInit = (mapInstance) => {
map.value = mapInstance;
// 创建图层
baseLayers.vector = new T.TileLayer('vec');
baseLayers.vectorLabel = new T.TileLayer('cva');
baseLayers.image = new T.TileLayer('img');
baseLayers.imageLabel = new T.TileLayer('cia');
// 添加默认图层
map.value.addLayer(baseLayers.image);
map.value.addLayer(baseLayers.imageLabel);
// 创建覆盖物图层
overlayLayer.value = new T.Map.OverlayLayer();
map.value.addLayer(overlayLayer.value);
// 添加控件
map.value.addControl(new T.Control.Zoom());
map.value.addControl(new T.Control.Scale());
// 事件监听
map.value.addEventListener('zoomend', updateScale);
map.value.addEventListener('moveend', updateScale);
// 初始加载数据
loadFields();
};
// 更新比例尺
const updateScale = () => {
if (map.value) {
mapZoom.value = map.value.getZoom();
scale.value = Math.round(map.value.getScale());
}
});
};
// 切换底图
const changeBaseLayer = () => {
if (!map.value) return;
// 移除当前底图
map.value.removeLayer(baseLayers.vector);
map.value.removeLayer(baseLayers.vectorLabel);
map.value.removeLayer(baseLayers.image);
map.value.removeLayer(baseLayers.imageLabel);
// 添加新底图
if (layerType.value === 'vector') {
map.value.addLayer(baseLayers.vector);
map.value.addLayer(baseLayers.vectorLabel);
} else {
map.value.addLayer(baseLayers.image);
map.value.addLayer(baseLayers.imageLabel);
}
};
// 加载地块数据
const loadFields = () => {
fieldService.getFields().then((data) => {
fields.value = data;
refreshOverlays();
});
};
// 刷新覆盖物
const refreshOverlays = () => {
if (!map.value || !overlayLayer.value) return;
// 清除所有覆盖物
overlayLayer.value.clearOverLays();
// 如果不显示地块图层则跳过绘制
if (!showFieldLayer.value) return;
// 绘制所有地块
fields.value.forEach((field) => {
const isSelected = selectedField.value?.id === field.id;
const polygon = createPolygon(field, isSelected);
overlayLayer.value.addOverLay(polygon);
});
};
// 创建多边形
const createPolygon = (field, isSelected = false) => {
const coords = field.geometry.coordinates[0].map((c) => new T.LngLat(c[0], c[1]));
return new T.Polygon(coords, {
color: isSelected ? '#ff0000' : '#1890ff',
weight: isSelected ? 3 : 2,
opacity: 0.8,
fillColor: isSelected ? '#ffa39e' : '#e6f7ff',
fillOpacity: 0.5,
});
};
// 选择地块
const selectField = (field) => {
selectedField.value = field;
refreshOverlays();
// 居中显示选中地块
if (map.value) {
const coords = field.geometry.coordinates[0];
const center = coords.reduce(
(acc, coord) => {
acc[0] += coord[0];
acc[1] += coord[1];
return acc;
},
[0, 0]
);
center[0] /= coords.length;
center[1] /= coords.length;
map.value.panTo(new T.LngLat(center[0], center[1]));
}
};
// 开始绘制
const startDrawing = () => {
if (!map.value) return;
// 清除当前覆盖物
refreshOverlays();
// 创建绘制工具
const polygonTool = new T.PolygonTool(map.value, {
showLabel: true,
color: '#fa541c',
weight: 3,
opacity: 0.6,
fillColor: '#ffbb96',
fillOpacity: 0.4,
});
polygonTool.open();
// 绘制完成事件
polygonTool.addEventListener('draw', (e) => {
newFieldCoords.value = e.currentLnglats.map((lnglat) => [lnglat.lng, lnglat.lat]);
newFieldArea.value = e.currentArea;
drawDialogVisible.value = true;
// 清除临时图形
polygonTool.close();
});
};
// 保存新地块
const saveNewField = () => {
if (!newFieldName.value.trim()) {
ElMessage.error('请输入地块名称');
return;
}
const newField = {
id: Date.now(),
name: newFieldName.value,
area: newFieldArea.value,
geometry: {
type: 'Polygon',
coordinates: [newFieldCoords.value],
},
};
fieldService.createField(newField).then(() => {
ElMessage.success('地块创建成功');
drawDialogVisible.value = false;
newFieldName.value = '';
loadFields();
});
};
// 取消绘制
const cancelDrawing = () => {
drawDialogVisible.value = false;
refreshOverlays();
};
// 删除地块
const removeField = () => {
if (!selectedField.value) return;
fieldService.deleteField(selectedField.value.id).then(() => {
ElMessage.success('地块已删除');
selectedField.value = null;
loadFields();
});
};
// 监听地块图层显示状态
watch(showFieldLayer, refreshOverlays);
</script>
<style scoped>
.mapDiv {
.field-management {
display: flex;
height: calc(100vh - 160px);
}
.panel.left {
width: 320px;
padding: 15px;
border-right: 1px solid #e4e7ed;
display: flex;
flex-direction: column;
background: #f8fafc;
}
.panel.right {
flex: 1;
position: relative;
}
.map {
width: 100%;
height: 100vh; /* 确保容器有明确高度 */
height: 100%;
}
.layer-switch {
position: absolute;
top: 15px;
right: 15px;
background: white;
padding: 8px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
}
.field-layer-switch {
position: absolute;
top: 60px;
right: 15px;
background: white;
padding: 8px;
border-radius: 4px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
display: flex;
align-items: center;
gap: 8px;
}
.zoom-scale {
position: absolute;
bottom: 15px;
left: 50%;
transform: translateX(-50%);
background: rgba(255, 255, 255, 0.85);
padding: 6px 12px;
border-radius: 4px;
font-size: 14px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 1000;
}
.stats {
padding: 12px;
margin: 10px 0;
background: #edf2ff;
border-radius: 4px;
font-weight: 500;
color: #364fc7;
}
.button-group {
display: flex;
gap: 10px;
margin-top: 10px;
}
.button-group > * {
flex: 1;
}
</style>

10
sub-government-affairs-service/src/views/resource/database/Statistics.vue
View File

@ -1,7 +1,6 @@
<template>
<!-- <div class="custom-page" :style="`background-image: url(${getAssetsFile('images/landBase/land2.png')})`"> -->
<div class="custom-page">
<!-- <h1>统计数据</h1> -->
<div class="custom-page" :style="`background-image: url(${getAssetsFile('images/landBase/land2.png')})`">
<!-- <div class="custom-page">
<div class="content">
<div style="display: flex">
<pieChart v-for="(item, index) in data" :key="index" class="m-left" :refs="item.refs" :title="item.title" :data="item.data" />
@ -9,12 +8,13 @@
<div style="display: flex; margin-top: 20px">
<pieChart v-for="(item, index) in data1" :key="index" class="m-left" :refs="item.refs" :title="item.title" :data="item.data" />
</div>
</div>
</div> -->
</div>
</template>
<script setup>
import { getOverview, getSubArea } from '../../../apis/resource/statisticAnalysis';
import { getAssetsFile } from '@/utils';
import { ref, onBeforeMount, reactive } from 'vue';
import 'echarts-gl';
import pieChart from './components/pie-chart.vue';
@ -57,7 +57,7 @@ let data1 = ref([
]);
onBeforeMount(() => {
getData();
// getData();
});
const getData = async () => {

28
yarn.lock
View File

@ -621,11 +621,6 @@ minimatch@^3.0.4:
dependencies:
brace-expansion "^1.1.7"
mitt@^3.0.0:
version "3.0.1"
resolved "https://registry.npmmirror.com/mitt/-/mitt-3.0.1.tgz"
integrity sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==
nice-try@^1.0.4:
version "1.0.5"
resolved "https://registry.npmmirror.com/nice-try/-/nice-try-1.0.5.tgz"
@ -1040,29 +1035,6 @@ validate-npm-package-license@^3.0.1:
spdx-correct "^3.0.0"
spdx-expression-parse "^3.0.0"
vue-demi@^0.12.1:
version "0.12.5"
resolved "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.12.5.tgz"
integrity sha512-BREuTgTYlUr0zw0EZn3hnhC3I6gPWv+Kwh4MCih6QcAeaTlaIX0DwOVN0wHej7hSvDPecz4jygy/idsgKfW58Q==
vue-demi@^0.14.10:
version "0.14.10"
resolved "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz"
integrity sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==
vue-tianditu@^2.7.6:
version "2.7.6"
resolved "https://registry.npmmirror.com/vue-tianditu/-/vue-tianditu-2.7.6.tgz"
integrity sha512-Yvcxg0IAgGB3ZY8zlC5ayjo9f85fa8PFTaifguTNpri76g67GO9toaRWMjBKi39yYHMBADaT3P6bEkJx87X8MQ==
dependencies:
mitt "^3.0.0"
vue-demi "^0.12.1"
"vue@^2.0.0 || >=3.0.0", "vue@^3.0.0-0 || ^2.6.0":
version "2.6.14"
resolved "https://registry.npmmirror.com/vue/-/vue-2.6.14.tgz"
integrity sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ==
which-boxed-primitive@^1.1.0, which-boxed-primitive@^1.1.1:
version "1.1.1"
resolved "https://registry.npmmirror.com/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz"