[案件修改]画面
Zhufu
parent
95c72e4b5d
commit
32c7ded50d
|
|
@ -80,6 +80,14 @@ enum Api {
|
|||
CaseOffence = '/api/DroneCaseInfoSingle/CaseOffence',
|
||||
LoadCaseInfoListOffence = '/api/DroneCaseInfoSingle/LoadCaseInfoListOffence',
|
||||
DealIllegalCaseInfo = '/api/DroneCaseInfoSingle/dealIllegalCaseInfo',
|
||||
// 修改案件-获取案件列表
|
||||
LoadCaseInfoListForUpdate = '/api/DroneCaseInfoSingle/LoadCaseInfoListForUpdate',
|
||||
// 修改案件-获取单个案件信息
|
||||
LoadCaseInfoById = '/api/DroneCaseInfoSingle/LoadCaseInfoById',
|
||||
// 修改案件-修改案件信息
|
||||
UpdateCaseInfo = '/api/DroneCaseInfoSingle/UpdateCaseInfo',
|
||||
// 修改案件-获取案件历史信息
|
||||
LoadCaseHistoryInfoList = '/api/DroneCaseInfoSingle/LoadCaseHistoryInfoList',
|
||||
}
|
||||
|
||||
export const getPositionsTree = (params?: AccountParams) =>
|
||||
|
|
@ -356,3 +364,27 @@ export function dealIllegalCaseInfo(params) {
|
|||
params,
|
||||
});
|
||||
}
|
||||
export function LoadCaseInfoListForUpdate(params) {
|
||||
return defHttp.get({
|
||||
url: Api.LoadCaseInfoListForUpdate,
|
||||
params,
|
||||
});
|
||||
}
|
||||
export function LoadCaseInfoById(params:{id: string}) {
|
||||
return defHttp.get({
|
||||
url: Api.LoadCaseInfoById,
|
||||
params,
|
||||
});
|
||||
}
|
||||
export function UpdateCaseInfo(data) {
|
||||
return defHttp.post({
|
||||
url: Api.UpdateCaseInfo,
|
||||
data,
|
||||
});
|
||||
}
|
||||
export function LoadCaseHistoryInfoList(params:{key: string}) {
|
||||
return defHttp.get({
|
||||
url: Api.LoadCaseHistoryInfoList,
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,33 @@
|
|||
<template>
|
||||
<div style="padding: 20px;">
|
||||
<a-descriptions bordered>
|
||||
<a-descriptions-item label="图斑编号">{{case_no}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{case_description}}</a-descriptions-item>
|
||||
<a-descriptions-item label="区县">{{countyname}}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{streetname}}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区">{{communityname}}</a-descriptions-item>
|
||||
<a-descriptions-item label="地址">{{address}}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{lng}}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{lat}}</a-descriptions-item>
|
||||
<a-descriptions-item label="总面积">{{area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="农用地面积">{{nongyongdi_area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="耕地面积">{{gengdi_area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="永久基本农田面积">{{yongjiujibennongtian_area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="重点区域面积">{{zhongdianquyu_area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="生态保护红线面积">{{shengtaibaohuhongxian_area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="国土空间规划面积">{{guotukongjianguihua_area}}</a-descriptions-item>
|
||||
<a-descriptions-item label="无人机编号">{{drone_no}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {defineProps} from "vue"
|
||||
const props = defineProps(['info'])
|
||||
const { id, case_no, case_description, countyid,
|
||||
countyname, streetid, streetname,communityid, communityname, address, drone_no, lng, lat,
|
||||
area, nongyongdi_area, gengdi_area, yongjiujibennongtian_area, zhongdianquyu_area, shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area } = props.info
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
<template>
|
||||
<BasicTable @register="registerTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
label: '查看',
|
||||
onClick: () => {
|
||||
showHistory(record)
|
||||
},
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<a-modal
|
||||
width="70%"
|
||||
v-model:open="showHistoryModal"
|
||||
title="历史详细"
|
||||
:destroyOnClose="true"
|
||||
@ok="closeShowHistoryModal"
|
||||
@cancel="closeShowHistoryModal">
|
||||
<ShowDetail :info="info"/>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, ref } from "vue"
|
||||
import { BasicTable,useTable,TableAction } from "@/components/Table";
|
||||
import { LoadCaseHistoryInfoList } from '@/api/demo/system';
|
||||
import { columns } from './util'
|
||||
import ShowDetail from './ShowDetail/index.vue'
|
||||
|
||||
const props = defineProps(['caseId'])
|
||||
const showHistoryModal = ref(false)
|
||||
const info = ref({})
|
||||
|
||||
const [registerTable, { }] =
|
||||
useTable({
|
||||
title: '历史记录',
|
||||
beforeFetch: (params) => {
|
||||
return {
|
||||
...params,
|
||||
key: props.caseId,
|
||||
}
|
||||
},
|
||||
api: LoadCaseHistoryInfoList,
|
||||
columns,
|
||||
rowKey: 'id',
|
||||
// 使用搜索表单
|
||||
useSearchForm: false,
|
||||
showTableSetting: true,
|
||||
actionColumn: {
|
||||
width: 120,
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
fixed: 'right',
|
||||
},
|
||||
});
|
||||
const showHistory = (record) => {
|
||||
showHistoryModal.value = true
|
||||
info.value = record
|
||||
}
|
||||
const closeShowHistoryModal = () => {
|
||||
showHistoryModal.value = false
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
export const columns = [
|
||||
{
|
||||
title: '修改时间',
|
||||
dataIndex: 'recordingtime',
|
||||
key: 'recordingtime',
|
||||
},
|
||||
{
|
||||
title: '面积',
|
||||
dataIndex: 'area',
|
||||
key: 'area',
|
||||
},
|
||||
{
|
||||
title: '农用地面积',
|
||||
dataIndex: 'nongyongdi_area',
|
||||
key: 'nongyongdi_area',
|
||||
},
|
||||
{
|
||||
title: '耕地面积',
|
||||
dataIndex: 'gengdi_area',
|
||||
key: 'gengdi_area',
|
||||
},
|
||||
{
|
||||
title: '永久基本农田面积',
|
||||
dataIndex: 'yongjiujibennongtian_area',
|
||||
key: 'yongjiujibennongtian_area',
|
||||
},
|
||||
{
|
||||
title: '重点区域面积',
|
||||
dataIndex: 'zhongdianquyu_area',
|
||||
key: 'zhongdianquyu_area',
|
||||
},
|
||||
{
|
||||
title: '生态保护红线面积',
|
||||
dataIndex: 'shengtaibaohuhongxian_area',
|
||||
key: 'shengtaibaohuhongxian_area',
|
||||
},
|
||||
{
|
||||
title: '国土空间规划面积',
|
||||
dataIndex: 'guotukongjianguihua_area',
|
||||
key: 'guotukongjianguihua_area',
|
||||
}
|
||||
]
|
||||
|
|
@ -0,0 +1,217 @@
|
|||
<template>
|
||||
<div class="content">
|
||||
<div class="row">
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">图斑编号：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.case_no"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">图斑描述：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.case_description"/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">区县：</div>
|
||||
<div class="item-input">
|
||||
<a-select
|
||||
v-model:value="props.infoResult.countyid"
|
||||
style="width: 100%"
|
||||
:options="countyOptions"
|
||||
@change="changeCounty"
|
||||
></a-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">乡镇：</div>
|
||||
<div class="item-input">
|
||||
<a-select
|
||||
v-model:value="props.infoResult.streetid"
|
||||
style="width: 100%"
|
||||
:options="streetOptions"
|
||||
@change="changeStreet"
|
||||
></a-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">社区：</div>
|
||||
<div class="item-input">
|
||||
<a-select
|
||||
v-model:value="props.infoResult.communityid"
|
||||
style="width: 100%"
|
||||
:options="communityOptions"
|
||||
@change="changeCommunity"
|
||||
></a-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">地址：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.address"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">经度：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.lng"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">纬度：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.lat"/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">总面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.area"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">农用地面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.nongyongdi_area"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">耕地面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.gengdi_area"/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">永久基本农田面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.yongjiujibennongtian_area"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">重点区域面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.zhongdianquyu_area"/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">生态保护红线面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.shengtaibaohuhongxian_area"/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="item" style="width: 33.3%;">
|
||||
<div class="label">国土空间规划面积：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.guotukongjianguihua_area"/></div>
|
||||
</div>
|
||||
<div class="item" style="width: 33.3%;">
|
||||
<div class="label">无人机编号：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.drone_no"/></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, onMounted, ref } from "vue"
|
||||
import { getChildrenTree } from '@/api/demo/system'
|
||||
const props = defineProps(['infoData','infoResult'])
|
||||
const countyOptions = ref([])
|
||||
const streetOptions = ref([])
|
||||
const communityOptions = ref([])
|
||||
onMounted(() => {
|
||||
const { id, case_no, case_description, countyid,
|
||||
countyname, streetid, streetname,communityid, communityname, address, drone_no, lng, lat,
|
||||
area, nongyongdi_area, gengdi_area, yongjiujibennongtian_area, zhongdianquyu_area, shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area} = props.infoData
|
||||
getChildrenTree({parentId:371300}).then(res =>{
|
||||
countyOptions.value = res.map(item => {
|
||||
return {
|
||||
value: item.id.toString(),
|
||||
label: item.name
|
||||
}
|
||||
})
|
||||
})
|
||||
if(countyid){
|
||||
getChildrenTree({parentId:countyid}).then(res =>{
|
||||
streetOptions.value = res.map(item => {
|
||||
return {
|
||||
value: item.id.toString(),
|
||||
label: item.name
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
if(streetid){
|
||||
getChildrenTree({parentId:streetid}).then(res =>{
|
||||
communityOptions.value = res.map(item => {
|
||||
return {
|
||||
value: item.id.toString(),
|
||||
label: item.name
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
props.infoResult.id = id
|
||||
props.infoResult.case_no = case_no
|
||||
props.infoResult.case_description = case_description
|
||||
props.infoResult.countyid = countyid
|
||||
props.infoResult.countyname = countyname
|
||||
props.infoResult.streetid = streetid
|
||||
props.infoResult.streetname = streetname
|
||||
props.infoResult.communityid = communityid
|
||||
props.infoResult.communityname = communityname
|
||||
props.infoResult.address = address
|
||||
props.infoResult.drone_no = drone_no
|
||||
props.infoResult.lng = lng
|
||||
props.infoResult.lat = lat
|
||||
props.infoResult.area = area
|
||||
props.infoResult.nongyongdi_area = nongyongdi_area
|
||||
props.infoResult.gengdi_area = gengdi_area
|
||||
props.infoResult.yongjiujibennongtian_area = yongjiujibennongtian_area
|
||||
props.infoResult.zhongdianquyu_area = zhongdianquyu_area
|
||||
props.infoResult.shengtaibaohuhongxian_area = shengtaibaohuhongxian_area
|
||||
props.infoResult.guotukongjianguihua_area = guotukongjianguihua_area
|
||||
})
|
||||
const changeCounty = (val) => {
|
||||
props.infoResult.countyname = countyOptions.value.find(item => item.value == val)?.label
|
||||
props.infoResult.streetid = ''
|
||||
props.infoResult.streetname = ''
|
||||
props.infoResult.communityid = ''
|
||||
props.infoResult.communityname = ''
|
||||
getChildrenTree({parentId:val}).then(res =>{
|
||||
streetOptions.value = res.map(item => {
|
||||
return {
|
||||
value: item.id.toString(),
|
||||
label: item.name
|
||||
}
|
||||
})
|
||||
})
|
||||
communityOptions.value = []
|
||||
}
|
||||
const changeStreet = (val) => {
|
||||
props.infoResult.streetname = streetOptions.value.find(item => item.value == val)?.label
|
||||
props.infoResult.communityid = ''
|
||||
props.infoResult.communityname = ''
|
||||
getChildrenTree({parentId:val}).then(res =>{
|
||||
communityOptions.value = res.map(item => {
|
||||
return {
|
||||
value: item.id.toString(),
|
||||
label: item.name
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
const changeCommunity = (val) => {
|
||||
props.infoResult.communityname = communityOptions.value.find(item => item.value == val)?.label
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content{
|
||||
padding: 20px;
|
||||
.row{
|
||||
display: flex;
|
||||
margin-bottom: 25px;
|
||||
.item{
|
||||
display: flex;
|
||||
.label{
|
||||
width: 150px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.item-input{
|
||||
flex: 1,
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,222 @@
|
|||
import { BasicColumn, FormSchema } from '@/components/Table';
|
||||
// import { getChildrenTree } from '@/api/demo/system';
|
||||
|
||||
const getYearList = () => {
|
||||
const num = 10;
|
||||
const currentYear = new Date().getFullYear();
|
||||
// 存储年份数据的数组
|
||||
const list: any = [];
|
||||
// 获取当前年份
|
||||
// year.value = Number(`${currentYear}`);
|
||||
list.push({
|
||||
value: Number(`${currentYear}`),
|
||||
label: Number(`${currentYear}`),
|
||||
});
|
||||
// 获取后面几年的数据
|
||||
for (let i = 1; i <= num; i++) {
|
||||
list.push({
|
||||
value: Number(`${currentYear - i}`),
|
||||
label: Number(`${currentYear - i}`),
|
||||
});
|
||||
}
|
||||
return list;
|
||||
};
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '图斑编号',
|
||||
dataIndex: 'case_no',
|
||||
width:180,
|
||||
},
|
||||
{
|
||||
title: '图斑描述',
|
||||
dataIndex: 'case_description',
|
||||
width:230,
|
||||
},
|
||||
{
|
||||
title: '区县',
|
||||
dataIndex: 'countyname',
|
||||
},
|
||||
{
|
||||
title: '乡镇',
|
||||
dataIndex: 'streetname',
|
||||
},
|
||||
{
|
||||
title: '社区',
|
||||
dataIndex: 'communityname',
|
||||
},
|
||||
{
|
||||
title: '图斑面积',
|
||||
dataIndex: 'area',
|
||||
},
|
||||
{
|
||||
title: '农用地面积',
|
||||
dataIndex: 'nongyongdi_area',
|
||||
},
|
||||
{
|
||||
title: '耕地面积',
|
||||
dataIndex: 'gengdi_area',
|
||||
},
|
||||
{
|
||||
title: '永久基本农田面积',
|
||||
dataIndex: 'yongjiujibennongtian_area',
|
||||
},
|
||||
{
|
||||
title: '重点区域面积',
|
||||
dataIndex: 'zhongdianquyu_area',
|
||||
},
|
||||
{
|
||||
title: '生态保护红线面积',
|
||||
dataIndex: 'shengtaibaohuhongxian_area',
|
||||
},
|
||||
{
|
||||
title: '国土空间规划面积',
|
||||
dataIndex: 'guotukongjianguihua_area',
|
||||
},
|
||||
];
|
||||
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
// {
|
||||
// field: 'year',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// label: '年份',
|
||||
// componentProps: {
|
||||
// options: getYearList(),
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'tubanlaiyuan',
|
||||
// label: '图斑来源',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: {
|
||||
// options: [
|
||||
// {
|
||||
// label: '全域巡查',
|
||||
// value: '全域巡查',
|
||||
// },
|
||||
// {
|
||||
// label: '卫片下发',
|
||||
// value: '卫片下发',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'picihao',
|
||||
// label: '批次',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: {
|
||||
// options: [],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'typename',
|
||||
// label: '图斑类型',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: {
|
||||
// options: [
|
||||
// { label: '农用地', value: '农用地' },
|
||||
// { label: '建设用地', value: '建设用地' },
|
||||
// { label: '推堆土', value: '推堆土' },
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'isBuildName',
|
||||
// label: '标注类型',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: {
|
||||
// options: [
|
||||
// { label: '在建', value: '在建' },
|
||||
// { label: '已建成', value: '已建成' },
|
||||
// { label: '持续变化', value: '持续变化' },
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'isIllegal',
|
||||
// label: '判定结果',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: {
|
||||
// options: [
|
||||
// { label: '合法', value: 0 },
|
||||
// { label: '违法', value: 1 },
|
||||
// { label: '其他', value: 2 },
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'nowStatus',
|
||||
// label: '当前状态',
|
||||
// component: 'Select',
|
||||
// componentProps: {
|
||||
// options: [
|
||||
// { label: '待接收', value: '待接收' },
|
||||
// { label: '待填报', value: '待填报' },
|
||||
// { label: '待整改', value: '待整改' },
|
||||
// { label: '市级审核', value: '市级审核' },
|
||||
// { label: '县级审核', value: '县级审核' },
|
||||
// { label: '已归档', value: '已归档' },
|
||||
// ],
|
||||
// },
|
||||
// colProps: { span: 4 },
|
||||
// },
|
||||
// {
|
||||
// field: 'measureName',
|
||||
// label: '整改措施',
|
||||
// component: 'Select',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: {
|
||||
// options: [
|
||||
// { label: '拆除复耕', value: '0' },
|
||||
// { label: '补办手续', value: '1' },
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'countyid',
|
||||
// label: '区县',
|
||||
// component: 'ApiSelect',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: ({ tableAction, formModel }) => {
|
||||
// return {
|
||||
// api: getChildrenTree,
|
||||
// params: { parentId: 371300 },
|
||||
// // 接口参数
|
||||
// resultField: 'result',
|
||||
// labelField: 'name',
|
||||
// valueField: 'id',
|
||||
// onChange: () => {
|
||||
// formModel.streetid = '';
|
||||
// },
|
||||
// };
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// field: 'streetid',
|
||||
// label: '乡镇',
|
||||
// component: 'ApiSelect',
|
||||
// colProps: { span: 4 },
|
||||
// componentProps: ({ formModel }) => {
|
||||
// return {
|
||||
// api: formModel.countyid && getChildrenTree,
|
||||
// params: { parentId: formModel.countyid },
|
||||
// // 接口参数
|
||||
// resultField: 'result',
|
||||
// labelField: 'name',
|
||||
// valueField: 'id',
|
||||
// };
|
||||
// },
|
||||
// },
|
||||
{
|
||||
field: 'key',
|
||||
label: '图斑编号',
|
||||
component: 'Input',
|
||||
colProps: { span: 4 },
|
||||
},
|
||||
];
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
<template>
|
||||
<PageWrapper dense contentFullHeight fixedHeight>
|
||||
<div class="table-box">
|
||||
<BasicTable @register="registerTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
label: '编辑',
|
||||
onClick: () => {
|
||||
getCaseDetail(record)
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '历史记录',
|
||||
onClick: () => {
|
||||
getHistoryList(record)
|
||||
},
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
<a-modal
|
||||
width="70%"
|
||||
v-model:open="infoModal"
|
||||
title="图斑详情"
|
||||
:destroyOnClose="true"
|
||||
@ok="submit"
|
||||
@cancel="closeInfoModal">
|
||||
<InfoModal :infoData="infoData" :infoResult="infoResult"/>
|
||||
</a-modal>
|
||||
<a-modal
|
||||
width="50%"
|
||||
v-model:open="historyModal"
|
||||
title="历史记录"
|
||||
:destroyOnClose="true"
|
||||
@ok="closeHistoryModal"
|
||||
@cancel="closeHistoryModal">
|
||||
<HistoryModal :caseId="historyCaseId"/>
|
||||
</a-modal>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { PageWrapper } from '@/components/Page';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { LoadCaseInfoListForUpdate,LoadCaseInfoById,UpdateCaseInfo,LoadCaseHistoryInfoList } from '@/api/demo/system';
|
||||
import { BasicTable,useTable,TableAction } from '@/components/Table';
|
||||
import { columns, searchFormSchema } from './casemodification.data';
|
||||
import InfoModal from './InfoModal/index.vue'
|
||||
import HistoryModal from './HistoryModal/index.vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
|
||||
const infoModal = ref(false)
|
||||
const historyModal = ref(false)
|
||||
const historyCaseId = ref()
|
||||
const infoData = ref({})
|
||||
const infoResult = ref({})
|
||||
const [registerTable, { setTableData, reload, clearSelectedRowKeys, setPagination, setLoading }] =
|
||||
useTable({
|
||||
title: '图斑汇总',
|
||||
api: LoadCaseInfoListForUpdate,
|
||||
columns,
|
||||
rowKey: 'id',
|
||||
formConfig: {
|
||||
labelWidth: 120,
|
||||
schemas: searchFormSchema,
|
||||
},
|
||||
// 使用搜索表单
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
bordered: true,
|
||||
actionColumn: {
|
||||
width: 180,
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
fixed: 'right',
|
||||
},
|
||||
});
|
||||
const getCaseDetail = (record) => {
|
||||
LoadCaseInfoById({id: record.id}).then(res => {
|
||||
// console.log(res)
|
||||
// infoResult.value = {}
|
||||
infoData.value = res
|
||||
infoModal.value = true
|
||||
})
|
||||
}
|
||||
const getHistoryList = (record) => {
|
||||
// LoadCaseHistoryInfoList({key:record.id}).then(res => {
|
||||
historyCaseId.value = record.id
|
||||
historyModal.value = true
|
||||
|
||||
// console.log(res)
|
||||
// })
|
||||
|
||||
}
|
||||
const submit = () => {
|
||||
console.log('submit',infoResult.value)
|
||||
UpdateCaseInfo(infoResult.value).then(res => {
|
||||
console.log(res)
|
||||
message.success('修改成功')
|
||||
closeInfoModal()
|
||||
reload()
|
||||
})
|
||||
}
|
||||
const closeInfoModal = () => {
|
||||
infoModal.value = false
|
||||
infoResult.value = {}
|
||||
}
|
||||
const closeHistoryModal = () => {
|
||||
historyModal.value = false
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
</style>
|
||||
Loading…
Reference in New Issue