shenhong
This commit is contained in:
		
							parent
							
								
									a1501c143b
								
							
						
					
					
						commit
						d18c1f47a8
					
				| @ -11,7 +11,10 @@ VITE_APP_SUB_GSS = '//localhost:9529/sub-government-screen-service/' | ||||
| VITE_APP_SUB_GSR = '//localhost:9530/new-digital-agriculture-screen/' | ||||
| # 接口 | ||||
| VITE_APP_BASE_API = '/apis'  | ||||
| # VITE_APP_BASE_URL = 'http://47.109.205.2409:8080' | ||||
| VITE_APP_BASE_URL = 'http://47.109.205.240:8080' | ||||
| VITE_APP_UPLOAD_API = '/uploadApis' | ||||
| VITE_APP_UPLOAD_URL = 'http://47.109.205.240:8080' | ||||
| # 阿里云接口地址 | ||||
| # VITE_APP_BASE_URL = 'http://47.109.205.240:8080' | ||||
| # VITE_APP_UPLOAD_URL = 'http://47.109.205.240:9300' | ||||
| # 内网接口地址 | ||||
| VITE_APP_BASE_URL = 'http://192.168.18.9:8080' | ||||
| VITE_APP_UPLOAD_URL = 'http://192.168.18.9:9300' | ||||
|  | ||||
| @ -4,9 +4,14 @@ VITE_MODE = 'DEV' | ||||
| VITE_APP_MIAN = 'daimp-front-main' | ||||
| VITE_APP_MIAN_URL = 'http://localhost:9000' | ||||
| VITE_APP_NAME = 'sub-government-affairs-service' | ||||
| 
 | ||||
| VITE_APP_BASE_API = '/apis'  | ||||
| # VITE_APP_BASE_URL = 'http://192.168.18.99:8080' | ||||
| VITE_APP_BASE_URL = 'http://47.109.205.240:8080' | ||||
| VITE_APP_UPLOAD_API = '/uploadApis' | ||||
| 
 | ||||
| # 阿里云接口地址 | ||||
| # VITE_APP_BASE_URL = 'http://47.109.205.240:8080' | ||||
| # VITE_APP_UPLOAD_URL = 'http://47.109.205.240:9300' | ||||
| 
 | ||||
| # 内网接口地址 | ||||
| VITE_APP_BASE_URL = 'http://192.168.18.99:8080' | ||||
| VITE_APP_UPLOAD_URL = 'http://192.168.18.99:9300' | ||||
| # VITE_APP_UPLOAD_URL = 'http://192.168.18.14:8080' | ||||
| @ -0,0 +1,140 @@ | ||||
| <template> | ||||
|   <div class="area-cascader-container"> | ||||
|     <div v-if="label" class="area-cascader-label">{{ label }}</div> | ||||
|     <div style="display: flex; gap: 8px" :style="{ width: width + 'px' }"> | ||||
|       <el-cascader | ||||
|         v-model="selectedAreaCode" | ||||
|         :options="areaOptions" | ||||
|         :props="cascaderProps" | ||||
|         :placeholder="areaPlaceholder" | ||||
|         style="flex: 1" | ||||
|         clearable | ||||
|       /> | ||||
|       <el-select v-model="selectedGridName" :placeholder="gridPlaceholder" style="flex: 1" clearable :disabled="!selectedAreaCode"> | ||||
|         <el-option v-for="item in gridOptions" :key="item.gridName" :label="item.gridName" :value="item.gridName" /> | ||||
|       </el-select> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script setup> | ||||
| import { ref, watch, onMounted, computed } from 'vue'; | ||||
| import { ElCascader, ElSelect, ElOption } from 'element-plus'; | ||||
| import axios from 'axios'; | ||||
| import { useUserStore } from '@/store/modules/user'; | ||||
| 
 | ||||
| const props = defineProps({ | ||||
|   value: { | ||||
|     type: Object, | ||||
|     default: () => ({}), | ||||
|   }, | ||||
|   label: { | ||||
|     type: String, | ||||
|     default: '所属行政区域-网格:', | ||||
|   }, | ||||
|   placeholder: { | ||||
|     type: String, | ||||
|     default: '请选择区域', | ||||
|   }, | ||||
|   width: { | ||||
|     type: [Number, String], | ||||
|     default: 300, | ||||
|   }, | ||||
| }); | ||||
| 
 | ||||
| const emit = defineEmits(['update:value']); | ||||
| 
 | ||||
| const userStore = useUserStore(); | ||||
| 
 | ||||
| const areaOptions = ref([]); | ||||
| const gridOptions = ref([]); | ||||
| 
 | ||||
| const selectedAreaCode = ref(''); | ||||
| const selectedGridName = ref(''); | ||||
| 
 | ||||
| // 获取行政区域数据 | ||||
| const fetchAreaData = async () => { | ||||
|   try { | ||||
|     const res = await axios.get(`${import.meta.env.VITE_APP_BASE_API}/system/area/region?areaCode=530000`, { | ||||
|       headers: { | ||||
|         authorization: userStore.token, | ||||
|       }, | ||||
|     }); | ||||
|     areaOptions.value = res.data?.data ?? []; | ||||
|   } catch (err) { | ||||
|     console.error('区域数据加载失败', err); | ||||
|   } | ||||
| }; | ||||
| 
 | ||||
| // 获取网格列表 | ||||
| const fetchGridList = async (regionCode) => { | ||||
|   if (!regionCode) return; | ||||
|   try { | ||||
|     const res = await axios.get(`${import.meta.env.VITE_APP_BASE_API}/land-resource/gridManage/page?regionCode=${regionCode}`, { | ||||
|       headers: { | ||||
|         authorization: userStore.token, | ||||
|       }, | ||||
|     }); | ||||
|     gridOptions.value = res.data?.data?.records ?? []; | ||||
|   } catch (err) { | ||||
|     console.error('网格数据加载失败', err); | ||||
|   } | ||||
| }; | ||||
| 
 | ||||
| // 监听行政区域变化,自动加载网格 | ||||
| watch(selectedAreaCode, (val) => { | ||||
|   selectedGridName.value = ''; | ||||
|   fetchGridList(val); | ||||
|   updateValue(); | ||||
| }); | ||||
| 
 | ||||
| // 监听网格选择 | ||||
| watch(selectedGridName, () => { | ||||
|   updateValue(); | ||||
| }); | ||||
| 
 | ||||
| // 外部传入值处理 | ||||
| watch( | ||||
|   () => props.value, | ||||
|   (val) => { | ||||
|     selectedAreaCode.value = val.regionCode ?? ''; | ||||
|     selectedGridName.value = val.gridName ?? ''; | ||||
|   }, | ||||
|   { immediate: true } | ||||
| ); | ||||
| 
 | ||||
| // 更新外部 v-model:value | ||||
| const updateValue = () => { | ||||
|   emit('update:value', { | ||||
|     regionCode: selectedAreaCode.value, | ||||
|     gridName: selectedGridName.value, | ||||
|   }); | ||||
| }; | ||||
| 
 | ||||
| onMounted(() => { | ||||
|   fetchAreaData(); | ||||
| }); | ||||
| 
 | ||||
| // 自定义字段映射 | ||||
| const cascaderProps = computed(() => ({ | ||||
|   label: 'areaName', | ||||
|   value: 'areaCode', | ||||
|   children: 'areaChildVOS', | ||||
|   emitPath: false, | ||||
|   expandTrigger: 'hover', | ||||
| })); | ||||
| </script> | ||||
| 
 | ||||
| <style scoped> | ||||
| .area-cascader-container { | ||||
|   display: flex; | ||||
|   /* flex-direction: column; */ | ||||
|   gap: 8px; | ||||
| } | ||||
| 
 | ||||
| .area-cascader-label { | ||||
|   font-size: 14px; | ||||
|   color: #606266; | ||||
|   align-self: center; | ||||
| } | ||||
| </style> | ||||
| @ -129,15 +129,18 @@ const state = reactive({ | ||||
|           trigger: 'blur', | ||||
|         }, | ||||
|       }, | ||||
|       { label: '种植作物', prop: 'cop', width: '120px', search: true, editDisplay: false }, | ||||
|       { label: '种植作物', prop: 'cropsName', width: '120px', search: true, editDisplay: false }, | ||||
|       { | ||||
|         label: '种植面积', | ||||
|         prop: 'plantingArea', | ||||
|         append: '亩', | ||||
|         rules: { | ||||
|           required: true, | ||||
|           message: '请输入', | ||||
|           trigger: 'blur', | ||||
|         }, | ||||
|         // formatter: (value) => `${value} 亩`, | ||||
|         formatter: (row, column, cellValue) => `${cellValue} 亩`, | ||||
|       }, | ||||
|       { | ||||
|         label: '种植月份', | ||||
| @ -155,6 +158,7 @@ const state = reactive({ | ||||
|             } | ||||
|           }, | ||||
|         }, | ||||
|         formatter: (row, column, cellValue) => `${cellValue} 月`, | ||||
|       }, | ||||
|       { | ||||
|         label: '生长周期', | ||||
| @ -173,10 +177,20 @@ const state = reactive({ | ||||
|             } | ||||
|           }, | ||||
|         }, | ||||
|         formatter: (row, column, cellValue) => { | ||||
|           const unitMap = { | ||||
|             1: '天', | ||||
|             2: '周', | ||||
|             3: '月', | ||||
|             4: '年', | ||||
|           }; | ||||
|           const unit = unitMap[row.growthCycleUnit] || ''; | ||||
|           return `${cellValue} ${unit}`; | ||||
|         }, | ||||
|       { label: '所属行政区域', prop: 'cop1', width: '120px', search: true, searchLabelWidth: 100, addDisplay: false, editDisplay: false }, | ||||
|       { label: '所属网格', prop: 'cop2', width: '120px', search: true, addDisplay: false, editDisplay: false }, | ||||
|       { label: '当前进度', prop: 'cop3', width: '120px', addDisplay: false, editDisplay: false }, | ||||
|       }, | ||||
|       { label: '所属行政区域', prop: 'regionName', width: '120px', search: true, searchLabelWidth: 100, addDisplay: false, editDisplay: false }, | ||||
|       { label: '所属网格', prop: 'gridName', width: '120px', search: true, addDisplay: false, editDisplay: false }, | ||||
|       { label: '当前进度', prop: 'currentProgress', width: '120px', addDisplay: false, editDisplay: false }, | ||||
|       // { | ||||
|       //   label: '备注', | ||||
|       //   prop: 'note', | ||||
|  | ||||
| @ -0,0 +1,37 @@ | ||||
| <template> | ||||
|   <div class="grid-records"></div> | ||||
| </template> | ||||
| <script setup> | ||||
| import { ref } from 'vue'; | ||||
| import { ElMessage } from 'element-plus'; | ||||
| 
 | ||||
| const records = ref([ | ||||
|   { | ||||
|     createTime: '2025-05-26 09:58:29', | ||||
|     createUser: '1', | ||||
|     updateTime: '2025-05-26T10:02:02.000+08:00', | ||||
|     updateUser: '1', | ||||
|     tenantId: 0, | ||||
|     id: '1926820200675004417', // 计划编号 | ||||
|     year: null, | ||||
|     regionCode: null, // 区域编码 | ||||
|     cropsId: null, // 作物id | ||||
|     gridId: null, // 网格id | ||||
|     planName: '大兴乡2025水稻种植计划', // 计划名称 | ||||
|     plantingArea: 120, // 计划种植面积 | ||||
|     plantingAreaActual: 335, // 实际种植面积 | ||||
|     plantingMonths: '1', // 种植月份 | ||||
|     growthCycle: '20', // 成长周期 | ||||
|     growthCycleUnit: '1', // 成长周期单位 1:天 2:周 3:月 4:年 | ||||
|     note: '暂无备注', // 备注 | ||||
|     deleteFlag: '0', // 删除标志 0:未删除 1:已删除 | ||||
|     cropsName: '', // 作物名称 | ||||
|     gridName: null, // 网格名称 | ||||
|     regionName: null, // 区域名称 | ||||
|     currentProgress: 279.17, // 当前进度 | ||||
|     actualFlag: '1', // 是否有实际填报内容 0:没有 1:有 | ||||
|   }, | ||||
| ]); | ||||
| </script> | ||||
| 
 | ||||
| <style scoped></style> | ||||
| @ -120,44 +120,27 @@ const option = reactive({ | ||||
|   menuWidth: 120, | ||||
|   selection: false, | ||||
|   column: [ | ||||
|     // { | ||||
|     //   hide: true, | ||||
|     //   label: '用地分类', | ||||
|     //   prop: 'landType', | ||||
|     //   search: true, | ||||
|     //   type: 'cascader', | ||||
|     //   dicData: landTreeDic, | ||||
|     //   clearable: false, | ||||
|     //   value: [], | ||||
|     //   addDisplay: false, | ||||
|     //   display: false, | ||||
|     //   editDisplay: false, | ||||
|     // }, | ||||
|     { | ||||
|       hide: true, | ||||
|       label: '用地分类', | ||||
|       prop: 'landType', | ||||
|       search: true, | ||||
|       type: 'cascader', | ||||
|       dicData: landTreeDic, | ||||
|       clearable: false, | ||||
|       value: [], | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '地块名', | ||||
|       label: '地块名称', | ||||
|       prop: 'landName', | ||||
|       search: true, | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 200, | ||||
|     }, | ||||
|     { | ||||
|       label: '地址', | ||||
|       prop: 'address', | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 300, | ||||
|     }, | ||||
|     { | ||||
|       label: '产权人', | ||||
|       prop: 'owner', | ||||
|       search: true, | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '所属网格', | ||||
|       prop: 'gridName', | ||||
| @ -167,16 +150,6 @@ const option = reactive({ | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '农用地分类', | ||||
|       prop: 'landClassificationType', | ||||
|       select: 'select', | ||||
|       dicData: landTreeDic, | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 300, | ||||
|     }, | ||||
|     { | ||||
|       label: '面积', | ||||
|       prop: 'area', | ||||
| @ -192,20 +165,39 @@ const option = reactive({ | ||||
|       }, | ||||
|     }, | ||||
|     { | ||||
|       label: '坐标', | ||||
|       prop: 'coordinate', | ||||
|       label: '土地类型', | ||||
|       prop: 'landTypeName', | ||||
|       search: true, | ||||
|       addDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '所属行政区域', | ||||
|       prop: 'regionName', | ||||
|       search: true, | ||||
|       addDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '具体位置', | ||||
|       prop: 'address', | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 300, | ||||
|     }, | ||||
|     { | ||||
|       label: '是否流转土地', | ||||
|       prop: 'landTransfer', | ||||
|       label: '产权人姓名', | ||||
|       prop: 'owner', | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 140, | ||||
|     }, | ||||
|     { | ||||
|       label: '产权人联系方式', | ||||
|       prop: 'ownerPhone', | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 300, | ||||
|     }, | ||||
|     { | ||||
|       label: '产权编号', | ||||
| @ -215,18 +207,10 @@ const option = reactive({ | ||||
|       editDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '土壤类型', | ||||
|       prop: 'soilTypeName', | ||||
|       addDisplay: false, | ||||
|       editDisplay: false, | ||||
|     }, | ||||
|     { | ||||
|       label: '是否上传附件', | ||||
|       prop: 'isUpload', | ||||
|       label: '信息录入时间', | ||||
|       prop: 'createTime', | ||||
|       addDisplay: false, | ||||
|       display: false, | ||||
|       editDisplay: false, | ||||
|       width: 140, | ||||
|     }, | ||||
|   ], | ||||
|   group: [ | ||||
|  | ||||
| @ -0,0 +1,7 @@ | ||||
| <script setup></script> | ||||
| 
 | ||||
| <template> | ||||
|   <div>123</div> | ||||
| </template> | ||||
| 
 | ||||
| <style scoped></style> | ||||
| @ -18,6 +18,10 @@ | ||||
|       @row-update="rowUpdate" | ||||
|       @row-del="rowDel" | ||||
|     > | ||||
|       <template #search="{ size }"> | ||||
|         <AreaCascader v-model:value="state.query" placeholder="选择行政区域与网格" :width="400" /> | ||||
|       </template> | ||||
| 
 | ||||
|       <template #menu-left> | ||||
|         <el-button type="success" icon="download" @click="onExport">导出</el-button> | ||||
|       </template> | ||||
| @ -25,6 +29,23 @@ | ||||
|       <template #menu="scope"> | ||||
|         <custom-table-operate :actions="state.options.actions" :data="scope" /> | ||||
|       </template> | ||||
| 
 | ||||
|       <template #detail="scope"> | ||||
|         <el-tabs type="border-card"> | ||||
|           <el-tab-pane label="基本信息"> | ||||
|             <avue-detail :option="baseDetailOption" :data="scope.row"></avue-detail> | ||||
|           </el-tab-pane> | ||||
|           <el-tab-pane label="网格地图"> | ||||
|             <div v-if="scope.row.mapUrl" style="height: 400px"> | ||||
|               <img :src="scope.row.mapUrl" style="max-width: 100%; max-height: 100%" /> | ||||
|             </div> | ||||
|             <el-empty v-else description="暂无地图数据"></el-empty> | ||||
|           </el-tab-pane> | ||||
|           <el-tab-pane label="其他信息"> | ||||
|             <avue-detail :option="otherDetailOption" :data="scope.row"></avue-detail> | ||||
|           </el-tab-pane> | ||||
|         </el-tabs> | ||||
|       </template> | ||||
|     </avue-crud> | ||||
|   </div> | ||||
| </template> | ||||
| @ -46,12 +67,16 @@ const state = reactive({ | ||||
|   query: { | ||||
|     current: 1, | ||||
|     size: 10, | ||||
|     gridName: '', | ||||
|     regionCode: '', | ||||
|   }, | ||||
|   form: {}, | ||||
|   selection: [], | ||||
|   options: { | ||||
|     ...CRUD_OPTIONS, | ||||
|     addBtnText: '添加网格', | ||||
|     // detail: true, | ||||
|     // detailTitle: '详情', | ||||
|     column: [ | ||||
|       { | ||||
|         label: '网格名称', | ||||
| @ -65,10 +90,8 @@ const state = reactive({ | ||||
|       { | ||||
|         label: '所属行政区域', | ||||
|         prop: 'gridAreaName', | ||||
|         // width: 300, | ||||
|         display: false, | ||||
|         // search: true, | ||||
|         searchLabelWidth: 100, | ||||
|         addDisplay: false, | ||||
|         viewDisplay: true, | ||||
|         rules: { | ||||
|           required: true, | ||||
|           message: '请输入', | ||||
| @ -80,13 +103,12 @@ const state = reactive({ | ||||
|         prop: 'cities', | ||||
|         type: 'cascader', | ||||
|         hide: true, | ||||
|         search: true, | ||||
|         searchLabelWidth: 100, | ||||
|         span: 24, | ||||
|         width: 300, | ||||
|         addDisplay: true, | ||||
|         editDisplay: true, | ||||
|         viewDisplay: false, | ||||
|         emitPath: false, | ||||
|         props: { | ||||
|           label: 'areaName', | ||||
|           value: 'areaCode', | ||||
| @ -104,43 +126,29 @@ const state = reactive({ | ||||
|         }, | ||||
|       }, | ||||
|       { | ||||
|         label: '网格名称', | ||||
|         prop: 'gridName', | ||||
|         type: 'select', | ||||
|         addDisplay: false, | ||||
|         label: '网格地图', | ||||
|         prop: 'mapUrl', | ||||
|         type: 'upload', | ||||
|         hide: true, | ||||
|         search: true, | ||||
|         searchLabelWidth: 100, | ||||
|         // action: `${VITE_APP_BASE_API}/system/file/upload`, | ||||
|       }, | ||||
|       // { | ||||
|       //   label: '省', | ||||
|       //   prop: 'provinceCode', | ||||
|       //   label: '网格名称', | ||||
|       //   prop: 'gridName', | ||||
|       //   type: 'select', | ||||
|       //   addDisplay: false, | ||||
|       //   hide: true, | ||||
|       //   display: false, | ||||
|       //   // search: true, | ||||
|       //   searchLabelWidth: 100, | ||||
|       //   dicUrl: `${VITE_APP_BASE_API}/land-resource/gridManage/page?regionCode={{key}}`, | ||||
|       //   props: { | ||||
|       //     label: 'gridName', | ||||
|       //     value: 'gridName', | ||||
|       //   }, | ||||
|       // { | ||||
|       //   label: '市', | ||||
|       //   prop: 'cityCode', | ||||
|       //   hide: true, | ||||
|       //   display: false, | ||||
|       //   dicHeaders: { | ||||
|       //     authorization: UserStore.token, | ||||
|       //   }, | ||||
|       // { | ||||
|       //   label: '县/区', | ||||
|       //   prop: 'gridAreaCode', | ||||
|       //   hide: true, | ||||
|       //   display: false, | ||||
|       // }, | ||||
|       // { | ||||
|       //   label: '乡镇', | ||||
|       //   prop: 'townCode', | ||||
|       //   hide: true, | ||||
|       //   display: false, | ||||
|       // }, | ||||
|       // { | ||||
|       //   label: '乡镇', | ||||
|       //   prop: 'village', | ||||
|       //   hide: true, | ||||
|       //   display: false, | ||||
|       //   dicFormatter: (res) => res.data?.records, | ||||
|       // }, | ||||
|       { | ||||
|         label: '备注', | ||||
| @ -186,6 +194,32 @@ const state = reactive({ | ||||
|   data: [], | ||||
|   currentRow: {}, | ||||
| }); | ||||
| const baseDetailOption = { | ||||
|   column: [ | ||||
|     { | ||||
|       label: '网格名称', | ||||
|       prop: 'gridName', | ||||
|     }, | ||||
|     { | ||||
|       label: '所属行政区域', | ||||
|       prop: 'gridAreaName', | ||||
|     }, | ||||
|     { | ||||
|       label: '备注', | ||||
|       prop: 'note', | ||||
|     }, | ||||
|   ], | ||||
| }; | ||||
| 
 | ||||
| const otherDetailOption = { | ||||
|   column: [ | ||||
|     { | ||||
|       label: '创建时间', | ||||
|       prop: 'createTime', | ||||
|     }, | ||||
|     // 可以添加更多字段... | ||||
|   ], | ||||
| }; | ||||
| 
 | ||||
| // 加载 | ||||
| const loadData = () => { | ||||
|  | ||||
| @ -0,0 +1,3 @@ | ||||
| <template>计划</template> | ||||
| <script></script> | ||||
| <style></style> | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user