Merge branch 'main' of http://123.132.248.154:10000/HC_YFZX/CaiYuanYiTiHua
commit
0f6205a9c4
|
|
@ -154,6 +154,8 @@ enum Api {
|
|||
SysLogsLoad = '/api/SysLogs/Load',
|
||||
// 版本更新列表
|
||||
SysAppFilesLoad = '/api/SysAppFiles/Load',
|
||||
// 线索关闭
|
||||
CloseSingleCaseInfo = '/api/DroneCaseInfoSingle/CloseSingleCaseInfo',
|
||||
}
|
||||
export const getPositionsTree = (params?: AccountParams) =>
|
||||
defHttp.get<AccountListGetResultModel>({ url: Api.PositionsTree, params });
|
||||
|
|
@ -570,4 +572,7 @@ export const SysLogsLoad = (params) =>
|
|||
defHttp.get({ url: Api.SysLogsLoad, params });
|
||||
// 版本更新列表
|
||||
export const SysAppFilesLoad = (params) =>
|
||||
defHttp.get({ url: Api.SysAppFilesLoad, params });
|
||||
defHttp.get({ url: Api.SysAppFilesLoad, params });
|
||||
// 线索关闭
|
||||
export const CloseSingleCaseInfo = (params) =>
|
||||
defHttp.post({ url: Api.CloseSingleCaseInfo, params });
|
||||
|
|
@ -69,6 +69,7 @@ enum Api {
|
|||
LoadNewCaseInfoMineralsTuBanImportantList = '/api/DroneCaseinfoMineralsNew/LoadNewCaseInfoMineralsTuBanImportantList',
|
||||
AddImportantXianSuo = '/api/DroneCaseinfoMineralsNew/AddImportantXianSuo',
|
||||
MineralsNewGetCaseInfoById = '/api/DroneCaseinfoMineralsNew/GetCaseInfoById',
|
||||
UpdatePicturePath = '/api/DroneCaseInfoMinerals/UpdatePicturePath',
|
||||
}
|
||||
|
||||
export function LoadCaiKuangTaskList(params) {
|
||||
|
|
@ -197,3 +198,6 @@ export function AddImportantXianSuo(params){
|
|||
export function MineralsNewGetCaseInfoById(params?: { id: string }){
|
||||
return defHttp.get({ url: Api.MineralsNewGetCaseInfoById, params });
|
||||
}
|
||||
export function UpdatePicturePath(params?: { id: string }){
|
||||
return defHttp.post({ url: Api.UpdatePicturePath, params });
|
||||
}
|
||||
|
|
|
|||
|
|
@ -139,7 +139,7 @@
|
|||
<!-- 违法 -->
|
||||
<template v-if="caseInfo.hefapanding_fill == 2">
|
||||
<a-descriptions-item label="违法类型">{{
|
||||
getLabel('weifaleixing', caseInfo.weifatype_kcfill)
|
||||
getLabel('weifaleixing', caseInfo.wefatype_kcfill)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="是否属于国家规划矿区">{{
|
||||
caseInfo.isguihua_kcfill
|
||||
|
|
@ -270,6 +270,32 @@
|
|||
<a-descriptions-item label="确认时间">{{
|
||||
caseInfo.xianshenhetime_fill
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="无人机复飞照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
<template
|
||||
v-for="(imageItem, imageIndex) in wrjffzhaopianList"
|
||||
:key="imageIndex"
|
||||
>
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
/>
|
||||
</template>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
|
|
@ -409,6 +435,9 @@
|
|||
const zhenggaihouzhaopianList = computed(() => {
|
||||
return caseInfo.value.zhaopianhou_jgzhg ? caseInfo.value.zhaopianhou_jgzhg.split(',') : [];
|
||||
});
|
||||
const wrjffzhaopianList = computed(() => {
|
||||
return caseInfo.value.wrjffzhaopian ? caseInfo.value.wrjffzhaopian.split(',') : [];
|
||||
});
|
||||
|
||||
const qitafujianList = computed(() => {
|
||||
return caseInfo.value.fujian_fill ? caseInfo.value.fujian_fill.split(',') : [];
|
||||
|
|
|
|||
|
|
@ -48,6 +48,20 @@
|
|||
<ShowInfoModal :showInfoData="showInfoData" />
|
||||
</div>
|
||||
</a-modal>
|
||||
<a-modal
|
||||
style="width: 50vw; margin: 0px; padding: 0px"
|
||||
wrap-class-name="full-modal"
|
||||
:centered="true"
|
||||
:mask="false"
|
||||
:maskClosable="false"
|
||||
:keyboard="false"
|
||||
v-model:open="uploadOpen"
|
||||
title="上传图片"
|
||||
:footer="null"
|
||||
@cancel="uploadOpen = false"
|
||||
>
|
||||
<UploadModal :allTableData="allTableData" />
|
||||
</a-modal>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
|
|
@ -63,6 +77,7 @@
|
|||
import { dataProcessingCount } from '@/views/demo/tiankongdi/util';
|
||||
import { PageWrapper } from '@/components/Page';
|
||||
import { message } from 'ant-design-vue';
|
||||
import UploadModal from './uploadModal.vue';
|
||||
|
||||
const { VITE_GLOB_API_URL } = getAppEnvConfig();
|
||||
|
||||
|
|
@ -77,6 +92,7 @@
|
|||
page: 1,
|
||||
limit: 10,
|
||||
})
|
||||
const uploadOpen = ref(false);
|
||||
const [registerTable, { getForm, reload, getPaginationRef, getDataSource }] =
|
||||
useTable({
|
||||
title: '标签列表',
|
||||
|
|
@ -120,10 +136,10 @@
|
|||
let fileName = '';
|
||||
if (exportType == 'excel') {
|
||||
url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSatellite/ExportCaseInfoWpxfTuBanList';
|
||||
fileName = '线索共享统计报表' + new Date().getTime() + '.xls';
|
||||
fileName = '标签列表统计报表' + new Date().getTime() + '.xls';
|
||||
} else if (exportType == 'shp') {
|
||||
url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSatellite/ExportCaseInfoWpxfShapefile';
|
||||
fileName = '线索共享矢量数据' + new Date().getTime() + '.zip';
|
||||
url = VITE_GLOB_API_URL + '/api/DroneCaseinfoMineralsNew/ExportNewIllegalCaiKuangShapefile';
|
||||
fileName = '标签列表矢量数据' + new Date().getTime() + '.zip';
|
||||
}
|
||||
axios({
|
||||
method: 'post',
|
||||
|
|
@ -148,8 +164,12 @@
|
|||
const open = ref<boolean>(false);
|
||||
function onBtnClicked(domId) {
|
||||
switch (domId) {
|
||||
case 'btnUpload':
|
||||
uploadOpen.value = true;
|
||||
break;
|
||||
case 'btnExport':
|
||||
open.value = true;
|
||||
// open.value = true;
|
||||
handleExport('shp')
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,258 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="upload">
|
||||
<a-upload
|
||||
v-model:file-list="fileList"
|
||||
list-type="picture-card"
|
||||
multiple
|
||||
:accept="'.jpg,.jpeg,.png'"
|
||||
:showUploadList="false"
|
||||
:custom-request="customRequest"
|
||||
>
|
||||
<div>
|
||||
<PlusOutlined />
|
||||
<div style="margin-top: 8px">上传图片</div>
|
||||
</div>
|
||||
</a-upload>
|
||||
</div>
|
||||
<div class="table">
|
||||
状态筛选：
|
||||
<a-select
|
||||
v-model:value="selectStatus"
|
||||
mode="multiple"
|
||||
style="width: 90%; margin-top: 5px; margin-bottom: 5px"
|
||||
allowClear
|
||||
:options="[
|
||||
{
|
||||
value: 'uploading',
|
||||
label: '上传中',
|
||||
},
|
||||
{
|
||||
value: 'done',
|
||||
label: '上传成功',
|
||||
},
|
||||
{
|
||||
value: 'error',
|
||||
label: '上传失败',
|
||||
},
|
||||
{
|
||||
value: 'updateSuccess',
|
||||
label: '插入成功',
|
||||
},
|
||||
{
|
||||
value: 'updateError',
|
||||
label: '插入失败',
|
||||
},
|
||||
]"
|
||||
/>
|
||||
<a-table
|
||||
:columns="uploadColumns"
|
||||
:data-source="filterData"
|
||||
:pagination="false"
|
||||
bordered
|
||||
:scroll="{ y: 600 }"
|
||||
>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'size'">
|
||||
{{ parseFloat(record.size / 1024 / 1024).toFixed(2) }} MB
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'percent'">
|
||||
<a-progress
|
||||
v-if="record.status == 'error'"
|
||||
:percent="record.percent"
|
||||
status="exception"
|
||||
/>
|
||||
<a-progress
|
||||
v-if="['done', 'updateSuccess', 'updateError'].includes(record.status)"
|
||||
:percent="record.percent"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'status'">
|
||||
<a-tag color="processing" v-if="record.status == 'uploading'">上传中</a-tag>
|
||||
<a-tag color="success" v-if="record.status == 'done'">上传成功</a-tag>
|
||||
<a-tag color="error" v-if="record.status == 'error'">上传失败</a-tag>
|
||||
<a-tag color="green" v-if="record.status == 'updateSuccess'">插入成功</a-tag>
|
||||
<a-tag color="red" v-if="record.status == 'updateError'">插入失败</a-tag>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'url' || column.dataIndex === 'message'">
|
||||
{{ record.url || record.message }}
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
<div class="updateDiv">
|
||||
<a-button type="primary" @click="startUploadCXJGData">
|
||||
将上传成功的图片插入到数据库
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { defineProps, ref, watch, onMounted, defineEmits, computed } from 'vue';
|
||||
import { PlusOutlined, CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
import axios from 'axios';
|
||||
import { UpdatePicturePath } from '@/api/illegalmining/index';
|
||||
import { uploadColumns } from './util';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
const props = defineProps(['allTableData']);
|
||||
|
||||
// 上传列表
|
||||
const fileList: any = ref();
|
||||
const selectStatus = ref([]);
|
||||
const filterData = computed(() => {
|
||||
if (fileList.value && selectStatus.value.length > 0) {
|
||||
return fileList.value.filter((item) => selectStatus.value.includes(item.status));
|
||||
} else {
|
||||
return fileList.value;
|
||||
}
|
||||
});
|
||||
|
||||
// 上传
|
||||
const customRequest = (file) => {
|
||||
const formData = new FormData();
|
||||
formData.append('files', file.file);
|
||||
axios({
|
||||
method: 'post',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/api/Platform/Upload`,
|
||||
params: { project: 'DroneEnforcement' },
|
||||
data: formData,
|
||||
headers: {
|
||||
'Content-type': 'multipart/form-data',
|
||||
},
|
||||
}).then((res) => {
|
||||
const index = fileList.value.findIndex((item) => item.uid === file.file.uid);
|
||||
// 上传成功
|
||||
if (res.data.code == '200') {
|
||||
let data = res.data.result;
|
||||
fileList.value[index] = {
|
||||
...fileList.value[index],
|
||||
percent: 100,
|
||||
status: 'done',
|
||||
url: data[0].filePath,
|
||||
};
|
||||
} else {
|
||||
// 上传失败
|
||||
fileList.value[index] = {
|
||||
...fileList.value[index],
|
||||
percent: 0,
|
||||
status: 'error',
|
||||
url: '',
|
||||
message: res.data.message,
|
||||
};
|
||||
}
|
||||
console.log('fileList',fileList.value)
|
||||
});
|
||||
};
|
||||
|
||||
// 持续监管-图片插入启动
|
||||
let uoloadArray: any = [];
|
||||
async function startUploadCXJGData() {
|
||||
const list = fileList.value;
|
||||
uoloadArray = [];
|
||||
|
||||
if (!list || list.length === 0) return;
|
||||
list.forEach((item) => {
|
||||
if (item.status === 'done' || item.status === 'updateError') {
|
||||
// 三个参数
|
||||
let caseid = item.name.split('.').slice(0, -1).join('.');
|
||||
let flag = false;
|
||||
if (caseid.includes('_CX')) {
|
||||
flag = true;
|
||||
}
|
||||
if (caseid.includes('_')) {
|
||||
caseid = caseid.split('_').slice(0, 1).join('_');
|
||||
}
|
||||
if (flag) {
|
||||
caseid = caseid + '_CX';
|
||||
}
|
||||
const index = fileList.value.findIndex((l) => l.uid === item.uid);
|
||||
const path = item.url;
|
||||
// 按线索编号分组
|
||||
const uoloadArrayIndex = uoloadArray.findIndex((l) => l.caseid === caseid);
|
||||
if (uoloadArrayIndex != -1) {
|
||||
uoloadArray[uoloadArrayIndex].index += ',' + index;
|
||||
uoloadArray[uoloadArrayIndex].path += ',' + path;
|
||||
} else {
|
||||
uoloadArray.push({
|
||||
caseid: caseid,
|
||||
index: index.toString(),
|
||||
path: path,
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 持续监管-图片插入
|
||||
if (!uoloadArray || uoloadArray.length === 0) return;
|
||||
for (let i = 0; i < uoloadArray.length; i++) {
|
||||
await UpdateUploadCXJGData(uoloadArray[i]);
|
||||
}
|
||||
}
|
||||
|
||||
// 持续监管-图片插入
|
||||
async function UpdateUploadCXJGData(value) {
|
||||
let querys = {
|
||||
caseno: value.caseid,
|
||||
path: value.path,
|
||||
};
|
||||
try {
|
||||
await UpdatePicturePath(querys).then((res) => {
|
||||
if (res) {
|
||||
const indexs = value.index.split(',');
|
||||
indexs?.forEach((index) => {
|
||||
fileList.value[index] = {
|
||||
...fileList.value[index],
|
||||
status: 'updateSuccess',
|
||||
};
|
||||
});
|
||||
} else {
|
||||
const indexs = value.index.split(',');
|
||||
indexs?.forEach((index) => {
|
||||
fileList.value[index] = {
|
||||
...fileList.value[index],
|
||||
status: 'updateError',
|
||||
};
|
||||
});
|
||||
if (props.allTableData.findIndex((item) => item.caseno == value.caseid)) {
|
||||
message.error(`线索【${value.caseid}】不存在！`);
|
||||
} else {
|
||||
message.error(`线索【${value.caseid}】有未审核的图片，不允许继续上传，请先审核！`);
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
const indexs = value.index.split(',');
|
||||
indexs?.forEach((index) => {
|
||||
fileList.value[index] = {
|
||||
...fileList.value[index],
|
||||
status: 'updateError',
|
||||
};
|
||||
});
|
||||
console.error('上传或审核出错:', error);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.upload {
|
||||
width: 100%;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.table {
|
||||
// width: 95%;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.updateDiv {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
::v-deep .ant-select-selection-item {
|
||||
width: 85px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -219,3 +219,31 @@ export const searchFormSchema: FormSchema[] = [
|
|||
colProps: { span: 6 },
|
||||
},
|
||||
];
|
||||
export const uploadColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: '大小',
|
||||
dataIndex: 'size',
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
title: '进度',
|
||||
dataIndex: 'percent',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
width: 80,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '路径/上传图片失败原因',
|
||||
dataIndex: 'url',
|
||||
width: 280,
|
||||
},
|
||||
];
|
||||
|
|
|
|||
|
|
@ -0,0 +1,317 @@
|
|||
<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" disabled/></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" disabled/></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"
|
||||
disabled
|
||||
></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"
|
||||
disabled
|
||||
></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"
|
||||
disabled
|
||||
></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" disabled/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">经度：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.lng" disabled/></div>
|
||||
</div>
|
||||
<div class="item" style="flex: 1;">
|
||||
<div class="label">纬度：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.lat" disabled/></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" disabled/></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" disabled/></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" disabled/></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" disabled/></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" disabled/></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" disabled/></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" disabled/></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" disabled/></div>
|
||||
</div>
|
||||
<div class="item" style="width: 33.3%;">
|
||||
<div class="label">备注：</div>
|
||||
<div class="item-input"><a-input v-model:value="props.infoResult.remark" disabled/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="item" style="width: 100%;">
|
||||
<div class="label">图片：</div>
|
||||
<div style="flex:9;display:flex;">
|
||||
<a-image-preview-group>
|
||||
<div class="video-item" v-for="(item, index) in fileList" :key="index" style="display: inline-block;position:relative;">
|
||||
<a-image :src="item.url" style="width:100px;height:100px;" />
|
||||
</div>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, onMounted, ref, watch, defineEmits } from "vue"
|
||||
import { getChildrenTree } from '@/api/demo/system'
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
import axios from "axios";
|
||||
import { Upload } from 'ant-design-vue';
|
||||
import { PlusOutlined, CloseOutlined, ExclamationCircleOutlined, UploadOutlined } from '@ant-design/icons-vue';
|
||||
import { uploadFile } from '@/api/formrender/index';
|
||||
const props = defineProps(['infoData','infoResult','shppath'])
|
||||
const emits = defineEmits(['update:shppath'])
|
||||
const countyOptions = ref([])
|
||||
const streetOptions = ref([])
|
||||
const communityOptions = ref([])
|
||||
const fileList = ref<any>([])
|
||||
const shpList = 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, remark, casepic} = 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
|
||||
props.infoResult.remark = remark
|
||||
props.infoResult.casepic = casepic
|
||||
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
props.infoData.casepic && props.infoData.casepic.split(',').forEach(item => {
|
||||
fileList.value.push({
|
||||
uid: '-1',
|
||||
name: item,
|
||||
status: 'done',
|
||||
url: VITE_GLOB_INFO_IMAGE_URL + '/' + item,
|
||||
})
|
||||
})
|
||||
})
|
||||
watch(() => fileList.value.length, (val) => {
|
||||
props.infoResult.casepic = fileList.value.map(item => item.name).join(',')
|
||||
})
|
||||
const handleChange = (info) => {
|
||||
if (info.file.status !== 'uploading') {
|
||||
}
|
||||
if (info.file.status === 'done') {
|
||||
} else if (info.file.status === 'error') {
|
||||
}
|
||||
};
|
||||
const customRequest = (file) => {
|
||||
console.log('handleCustomRequest',file)
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
const formData = new FormData()
|
||||
formData.append('files', file.file)
|
||||
axios({
|
||||
method: 'post',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/api/Platform/Upload`,
|
||||
params: { project: 'DroneEnforcement'},
|
||||
data: formData,
|
||||
headers: {
|
||||
'Content-type': 'multipart/form-data',
|
||||
},
|
||||
}).then(res => {
|
||||
let data = res.data.result
|
||||
console.log(res)
|
||||
fileList.value?.push({
|
||||
uid: '-1',
|
||||
name: data[0].filePath,
|
||||
status: 'done',
|
||||
url: VITE_GLOB_INFO_IMAGE_URL + '/' + data[0].filePath,
|
||||
});
|
||||
})
|
||||
}
|
||||
const handlerDelete = (index) => {
|
||||
fileList.value.splice(index, 1);
|
||||
}
|
||||
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
|
||||
}
|
||||
const shpCustomRequest = (file) => {
|
||||
const formData = new FormData()
|
||||
formData.append('files', file.file)
|
||||
uploadFile(formData).then(res => {
|
||||
emits('update:shppath',res[0].filePath)
|
||||
})
|
||||
}
|
||||
</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,
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.ant-image){
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.video-delete-btn {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 10px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-bottom-left-radius: 80%;
|
||||
background: rgb(0 0 0 / 20%);
|
||||
color: #fff;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,228 @@
|
|||
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 },
|
||||
},
|
||||
{
|
||||
field: 'originalcaseno',
|
||||
label: '标识号',
|
||||
component: 'Input',
|
||||
colProps: { span: 4 },
|
||||
},
|
||||
];
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
<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)
|
||||
},
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
<a-modal
|
||||
width="70%"
|
||||
v-model:open="infoModal"
|
||||
title="线索详情"
|
||||
:destroyOnClose="true"
|
||||
:okText="'关闭'"
|
||||
:okType="'danger'"
|
||||
@ok="submit"
|
||||
@cancel="closeInfoModal">
|
||||
<InfoModal :infoData="infoData" :infoResult="infoResult" v-model:shppath="shppath"/>
|
||||
</a-modal>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { PageWrapper } from '@/components/Page';
|
||||
import { onMounted, ref, h } from 'vue';
|
||||
import { LoadCaseInfoListForUpdate,LoadCaseInfoById,UpdateCaseInfo,LoadCaseHistoryInfoList } from '@/api/demo/system';
|
||||
import { BasicTable,useTable,TableAction } from '@/components/Table';
|
||||
import { columns, searchFormSchema } from './caseclose.data';
|
||||
import InfoModal from './InfoModal/index.vue'
|
||||
import { message, Modal } from 'ant-design-vue'
|
||||
import { CloseSingleCaseInfo } from '@/api/demo/system'
|
||||
|
||||
const infoModal = ref(false)
|
||||
const historyModal = ref(false)
|
||||
const historyCaseId = ref()
|
||||
const infoData = ref({})
|
||||
const infoResult = ref({})
|
||||
const shppath = ref()
|
||||
const closeCaseRemark = 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: 100,
|
||||
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 = () => {
|
||||
Modal.confirm({
|
||||
title: '请输入关闭原因',
|
||||
content: h('input',{
|
||||
class: 'reSubmitInput',
|
||||
onChange: (e) => closeCaseRemark.value = e.target.value
|
||||
}),
|
||||
onOk: async () => {
|
||||
if(closeCaseRemark.value.trim().length <=0){
|
||||
message.warning('关闭原因不能为空')
|
||||
return Promise.reject()
|
||||
}
|
||||
try{
|
||||
const result = await CloseSingleCaseInfo({id:infoData.value.id , closereason: closeCaseRemark.value})
|
||||
if(result){
|
||||
message.success('关闭线索成功');
|
||||
reload()
|
||||
closeInfoModal()
|
||||
}
|
||||
closeCaseRemark.value = ''
|
||||
} catch (error){
|
||||
closeCaseRemark.value = ''
|
||||
}
|
||||
},
|
||||
onCancel() {
|
||||
closeCaseRemark.value = ''
|
||||
},
|
||||
})
|
||||
|
||||
// UpdateCaseInfo(infoResult.value,shppath.value).then(res => {
|
||||
// console.log(res)
|
||||
// message.success('修改成功')
|
||||
// closeInfoModal()
|
||||
// reload()
|
||||
// })
|
||||
}
|
||||
const closeInfoModal = () => {
|
||||
infoModal.value = false
|
||||
infoResult.value = {}
|
||||
shppath.value = ''
|
||||
}
|
||||
const closeHistoryModal = () => {
|
||||
historyModal.value = false
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.reSubmitInput{
|
||||
border: 1px solid;
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
border-radius: 5px;
|
||||
padding: 0px 10px;
|
||||
border-color: #000;
|
||||
transition: 0.2s;
|
||||
&:focus{
|
||||
border-color: #6db8ff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue