You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
456 lines
21 KiB
456 lines
21 KiB
<template> |
|
<el-dialog width="80vw" top="5vh" v-model="show" :title="title"> |
|
<div style="height: 600px"> |
|
<template v-if="step === 1"> |
|
<div class="mt-20"> |
|
<span>案件核查问题台账模板</span> |
|
<a |
|
class="link" |
|
:href="`${BASE_PATH}/templates/案件核查问题台账（模板）.xlsx`" |
|
target="__blank" |
|
>下载</a |
|
> |
|
</div> |
|
<el-upload |
|
drag |
|
:multiple="false" |
|
:auto-upload="false" |
|
:show-file-list="false" |
|
v-model:file-list="fileList" |
|
accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" |
|
class="mt-20" |
|
> |
|
<template v-if="fileList.length === 0"> |
|
<el-icon class="el-icon--upload" |
|
><upload-filled |
|
/></el-icon> |
|
<div class="el-upload__text"> |
|
点击或拖拽文件到此区域上传 |
|
</div> |
|
</template> |
|
<template v-else> |
|
<el-icon class="el-icon--upload"><Select /></el-icon> |
|
<div class="el-upload__text"> |
|
已选择文件：{{ fileList[fileList.length - 1].name }} |
|
</div> |
|
</template> |
|
</el-upload> |
|
<el-radio-group v-model="dataUpdateMethod" class="mt-20"> |
|
<el-radio value="incremental" border>增量更新</el-radio> |
|
<el-radio value="overwrite" border>覆盖更新</el-radio> |
|
</el-radio-group> |
|
</template> |
|
<template v-else> |
|
<el-page-header @back="step = 1" class="mb-20"></el-page-header> |
|
<div style="height: 556px; overflow: hidden"> |
|
<el-scrollbar height="556px"> |
|
<el-tabs v-model="activeTab"> |
|
<el-tab-pane label="全部" name="all"> |
|
<div class="table-container"> |
|
<el-table |
|
:data="importTableData" |
|
ref="tableRef" |
|
> |
|
<el-table-column |
|
type="selection" |
|
:selectable=" |
|
(row) => row.state === 'success' |
|
" |
|
/> |
|
<el-table-column |
|
label="案件编号" |
|
prop="originId" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="受理时间" |
|
prop="discoveryTime" |
|
|
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="问题发生时间" |
|
prop="happenTime" |
|
width="160" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="问题来源" |
|
prop="problemSources" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="投诉人" |
|
prop="responderName" |
|
width="90" |
|
/> |
|
<el-table-column |
|
label="投诉人电话" |
|
prop="contactPhone" |
|
width="120" |
|
/> |
|
<el-table-column |
|
label="涉企涉冻" |
|
prop="involvedIssue" |
|
width="120" |
|
/> |
|
<el-table-column |
|
label="业务类别" |
|
prop="businessTypeName" |
|
/> |
|
<el-table-column |
|
label="涉嫌问题" |
|
prop="involveProblem" |
|
/> |
|
<el-table-column |
|
label="涉及警种" |
|
prop="policeTypeName" |
|
/> |
|
<el-table-column |
|
label="涉及单位二级机构" |
|
prop="secondDepartName" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="涉及单位所队" |
|
prop="thirdDepartName" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="具体内容" |
|
prop="thingDesc" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="数据校验" |
|
width="120" |
|
align="center" |
|
> |
|
<template #default="{ row }"> |
|
<el-tag |
|
type="success" |
|
v-if=" |
|
row.state === 'success' |
|
" |
|
>正确</el-tag |
|
> |
|
<el-tooltip |
|
effect="dark" |
|
:content="row.errMsg" |
|
placement="top-start" |
|
v-else |
|
> |
|
<el-tag type="danger" |
|
>异常</el-tag |
|
> |
|
</el-tooltip> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
label="操作" |
|
width="120" |
|
> |
|
<template #default="{ row }"> |
|
<el-button |
|
type="primary" |
|
link |
|
@click="handleEdit(row)" |
|
>编辑</el-button |
|
> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
</div> |
|
</el-tab-pane> |
|
<el-tab-pane name="fail"> |
|
<template #label> |
|
<el-badge |
|
:value="importTableFailData.length" |
|
> |
|
<span>异常</span> |
|
</el-badge> |
|
</template> |
|
<div class="table-container"> |
|
<el-table :data="importTableFailData"> |
|
<el-table-column |
|
label="案件编号" |
|
prop="originId" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="受理时间" |
|
prop="discoveryTime" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="问题发生时间" |
|
prop="happenTime" |
|
/> |
|
<el-table-column |
|
label="问题来源" |
|
prop="problemSources" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="投诉人" |
|
prop="responderName" |
|
width="90" |
|
/> |
|
<el-table-column |
|
label="投诉人电话" |
|
prop="contactPhone" |
|
width="120" |
|
/> |
|
<el-table-column |
|
label="业务类别" |
|
prop="businessTypeName" |
|
/> |
|
<el-table-column |
|
label="涉嫌问题" |
|
prop="involveProblem" |
|
/> |
|
<el-table-column |
|
label="涉及警种" |
|
prop="policeTypeName" |
|
/> |
|
<el-table-column |
|
label="涉及单位二级机构" |
|
prop="secondDepartName" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="涉及单位所队" |
|
prop="thirdDepartName" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="具体内容" |
|
prop="thingDesc" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="数据校验" |
|
width="100" |
|
align="center" |
|
> |
|
<template #default="{ row }"> |
|
<el-tooltip |
|
effect="dark" |
|
:content="row.errMsg" |
|
placement="top-start" |
|
> |
|
<el-tag type="danger" |
|
>异常</el-tag |
|
> |
|
</el-tooltip> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
label="操作" |
|
width="120" |
|
> |
|
<template #default="{ row }"> |
|
<el-button |
|
type="primary" |
|
link |
|
@click="handleEdit(row)" |
|
>编辑</el-button |
|
> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
</div> |
|
</el-tab-pane> |
|
</el-tabs> |
|
</el-scrollbar> |
|
</div> |
|
</template> |
|
</div> |
|
<footer class="flex end mt-20 v-center"> |
|
<span class="mr-20" v-if="step === 2" |
|
>选中：<b>{{ checkRowSize }}</b |
|
>条数据</span |
|
> |
|
<el-button size="large" @click="show = false">取消</el-button> |
|
<el-button |
|
type="primary" |
|
size="large" |
|
@click="handleImport" |
|
:disabled="fileList.length === 0" |
|
v-if="step === 1" |
|
v-loading="loading" |
|
>下一步</el-button |
|
> |
|
<el-button |
|
type="primary" |
|
size="large" |
|
@click="handleSaveImport" |
|
:disabled="checkRowSize === 0" |
|
v-else |
|
>确认导入</el-button |
|
> |
|
</footer> |
|
</el-dialog> |
|
|
|
<el-dialog width="660px" top="5vh" v-model="editShow" title="编辑数据"> |
|
<el-form :label-width="120" :model="form" ref="formRef"> |
|
<el-form-item |
|
label="案件编号" |
|
prop="originId" |
|
:rules="{ |
|
required: true, |
|
message: '请选择', |
|
trigger: ['blur'], |
|
}" |
|
> |
|
<el-input placeholder="请输入" v-model="form.originId" /> |
|
</el-form-item> |
|
<el-form-item label="受理时间"> |
|
<el-date-picker type="datetime" v-model="form.discoveryTime" /> |
|
</el-form-item> |
|
<el-form-item label="问题发生时间"> |
|
<el-date-picker type="datetime" v-model="form.happenTime" /> |
|
</el-form-item> |
|
<el-form-item label="问题来源"> |
|
<el-input placeholder="请输入" v-model="form.problemSources" /> |
|
</el-form-item> |
|
<el-form-item label="投诉人"> |
|
<el-input placeholder="请输入" v-model="form.responderName" /> |
|
</el-form-item> |
|
<el-form-item label="投诉人电话"> |
|
<el-input placeholder="请输入" v-model="form.contactPhone" /> |
|
</el-form-item> |
|
<el-form-item label="业务类别"> |
|
<el-input placeholder="请输入" v-model="form.businessTypeName" /> |
|
</el-form-item> |
|
<el-form-item label="涉嫌问题"> |
|
<el-input placeholder="请输入" v-model="form.involveProblem" /> |
|
</el-form-item> |
|
<el-form-item label="涉及警种"> |
|
<el-input placeholder="请输入" v-model="form.policeTypeName" /> |
|
</el-form-item> |
|
<el-form-item label="涉企涉冻"> |
|
<el-select v-model="form.involvedIssue"> |
|
<el-option value="涉企问题" label="涉企问题"></el-option> |
|
<el-option value="涉冻问题" label="涉冻问题"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item |
|
label="涉及单位" |
|
prop="involveThirdDepartId" |
|
> |
|
<depart-tree-select |
|
v-model="form.involveThirdDepartId" |
|
:check-strictly="false" |
|
@node-click="(node) => form.involveThirdDepartName = node.shortName" |
|
/> |
|
</el-form-item> |
|
<el-form-item |
|
label="具体内容" |
|
prop="thingDesc" |
|
:rules="{ |
|
required: true, |
|
message: '请输入', |
|
trigger: ['blur'], |
|
}" |
|
> |
|
<el-input type="textarea" v-model="form.thingDesc" /> |
|
</el-form-item> |
|
</el-form> |
|
<footer class="flex end mt-20"> |
|
<el-button @click="editShow = false">取消</el-button> |
|
<el-button type="primary" @click="handleEditSumbit" |
|
>确认修改</el-button |
|
> |
|
</footer> |
|
</el-dialog> |
|
</template> |
|
<script setup> |
|
import { BASE_PATH } from "@/api/request"; |
|
import { getDictLable } from "@/utils/util"; |
|
import { importCaseVerif, addCaseVerif } from "@/api/data/caseVerif"; |
|
import feedback from "@/utils/feedback"; |
|
|
|
const props = defineProps({ |
|
modelValue: { |
|
type: Boolean, |
|
default: false, |
|
}, |
|
title: { |
|
type: String, |
|
} |
|
}); |
|
const emit = defineEmits(["update:modelValue", "close", "update"]); |
|
|
|
const show = ref(false); |
|
watch( |
|
() => props.modelValue, |
|
(val) => { |
|
show.value = val; |
|
} |
|
); |
|
watch(show, (val) => { |
|
emit("update:modelValue", val); |
|
}); |
|
|
|
const dataUpdateMethod = ref("incremental"); |
|
const fileList = ref([]); |
|
|
|
const importTableData = ref([]); |
|
const importTableFailData = computed(() => { |
|
return importTableData.value.filter((item) => item.state === "fail"); |
|
}); |
|
|
|
const step = ref(1); |
|
const loading = ref(false); |
|
async function handleImport() { |
|
const formData = new FormData(); |
|
formData.append("file", fileList.value[fileList.value.length - 1].raw); |
|
loading.value = true; |
|
try { |
|
importTableData.value = await importCaseVerif(formData); |
|
} catch(e) { |
|
loading.value = false; |
|
return |
|
} |
|
loading.value = false; |
|
step.value = 2; |
|
nextTick(() => {}); |
|
} |
|
|
|
const checkRowSize = computed( |
|
() => tableRef.value?.getSelectionRows().length || 0 |
|
); |
|
|
|
const tableRef = ref(null); |
|
async function handleSaveImport() { |
|
const rows = tableRef.value.getSelectionRows(); |
|
await addCaseVerif(dataUpdateMethod.value, [...rows]); |
|
feedback.msgSuccess(`成功导入${rows.length}条数据`); |
|
step.value = 1; |
|
importTableData.value = []; |
|
fileList.value = []; |
|
emit("close"); |
|
emit("update"); |
|
} |
|
|
|
let activeIndex = -1; |
|
function handleEdit(row) { |
|
form.value = { ...row }; |
|
activeIndex = importTableData.value.indexOf(row); |
|
editShow.value = true; |
|
} |
|
const editShow = ref(false); |
|
const form = ref({}); |
|
const formRef = ref(); |
|
const activeTab = ref("all"); |
|
|
|
async function handleEditSumbit() { |
|
await formRef.value.validate(); |
|
form.value.state = "success"; |
|
importTableData.value[activeIndex] = form.value; |
|
editShow.value = false; |
|
} |
|
</script> |
|
<style lang="scss" scoped> |
|
</style>
|
|
|