|
|
<template> |
|
|
<el-dialog |
|
|
:title="mode === 'add' ? '添加登记来件' : '修改登记来件'" |
|
|
v-model="visibleProxy" |
|
|
width="70vw" |
|
|
top="2vh" |
|
|
style="margin-bottom: 0" |
|
|
> |
|
|
<el-scrollbar max-height="76vh"> |
|
|
<el-form |
|
|
ref="formRef" |
|
|
:model="formData" |
|
|
:label-width="150" |
|
|
class="form-layout" |
|
|
style="min-height: 66vh" |
|
|
:rules="rules" |
|
|
> |
|
|
<!-- 投诉信息 --> |
|
|
<h2>投诉信息</h2> |
|
|
<div class="add-negation-container"> |
|
|
<!-- 来源 --> |
|
|
<el-row> |
|
|
<el-col :span="12"> |
|
|
<el-form-item label="来源" prop="sourcePath"> |
|
|
<el-cascader |
|
|
v-model="formData.sourcePath" |
|
|
:options="dict.sourceTableAndLevel" |
|
|
:props="{ emitPath: true, checkStrictly: false }" |
|
|
clearable |
|
|
filterable |
|
|
show-all-levels |
|
|
style="width: 100%" |
|
|
placeholder="请选择来源（一级/二级）" |
|
|
/> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
|
|
|
<el-col :span="12"> |
|
|
<el-form-item label="业务类别" prop="handleMethod"> |
|
|
<el-select |
|
|
v-model="formData.businessTypeCode" |
|
|
placeholder="业务类别" |
|
|
clearable |
|
|
> |
|
|
<el-option |
|
|
v-for="item in dict.businessType" |
|
|
:key="item.id" |
|
|
:label="item.dictLabel" |
|
|
:value="item.dictValue" |
|
|
/> |
|
|
</el-select> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
|
|
|
</el-row> |
|
|
|
|
|
<!-- 编号 + 受理时间 --> |
|
|
<el-row> |
|
|
<el-col :span="12"> |
|
|
<el-form-item label="编号" prop="originId"> |
|
|
<el-input |
|
|
v-model="formData.originId" |
|
|
:placeholder="formData.originIdSkip ? '无' : '请输入编号'" |
|
|
:disabled="mode === 'edit' || formData.originIdSkip" |
|
|
> |
|
|
<template #append> |
|
|
<el-checkbox |
|
|
v-model="formData.originIdSkip" |
|
|
@change="(v) => v && (formData.originId = '')" |
|
|
:disabled="mode=== 'edit'" |
|
|
> |
|
|
无 |
|
|
</el-checkbox> |
|
|
</template> |
|
|
</el-input> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
|
|
|
<el-col :span="12"> |
|
|
<el-form-item label="登记/受理时间" prop="discoveryTime"> |
|
|
<el-date-picker |
|
|
v-model="formData.discoveryTime" |
|
|
type="datetime" |
|
|
placeholder="请选择" |
|
|
value-format="YYYY-MM-DDTHH:mm:ss" |
|
|
format="YYYY-MM-DD HH:mm:ss" |
|
|
style="width: 100%" |
|
|
/> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<!-- 来件人姓名 + 身份证号码 --> |
|
|
<el-row> |
|
|
<el-col :span="12"> |
|
|
<el-form-item label="来件人姓名" prop="responderName"> |
|
|
<el-input |
|
|
v-model="formData.responderName" |
|
|
:placeholder="formData.responderNameSkip ? '无' : '请输入来件人姓名'" |
|
|
:disabled="formData.responderNameSkip" |
|
|
@blur="onAutoCheckDuplicate" |
|
|
> |
|
|
<template #append> |
|
|
<el-checkbox |
|
|
v-model="formData.responderNameSkip" |
|
|
@change="(v) => v && (formData.responderName = '')" |
|
|
> |
|
|
无 |
|
|
</el-checkbox> |
|
|
</template> |
|
|
</el-input> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
|
|
|
<el-col :span="12"> |
|
|
<div style="display: flex; align-items: flex-start; gap: 8px;"> |
|
|
<el-form-item label="身份证号码" prop="responderIdCode" style="flex: 1; margin-bottom: 0;"> |
|
|
<el-input |
|
|
v-model="formData.responderIdCode" |
|
|
:placeholder="formData.responderIdCodeSkip ? '无' : '请输入身份证号码'" |
|
|
:disabled="formData.responderIdCodeSkip" |
|
|
@blur="onAutoCheckDuplicate" |
|
|
> |
|
|
<template #append> |
|
|
<el-checkbox |
|
|
v-model="formData.responderIdCodeSkip" |
|
|
@change="(v) => v && (formData.responderIdCode = '')" |
|
|
> |
|
|
无 |
|
|
</el-checkbox> |
|
|
</template> |
|
|
</el-input> |
|
|
</el-form-item> |
|
|
|
|
|
<el-button |
|
|
type="primary" |
|
|
:loading="duplicateLoading" |
|
|
@click="onCheckDuplicate" |
|
|
> |
|
|
查看 |
|
|
</el-button> |
|
|
|
|
|
<span |
|
|
v-if="duplicateHintVisible" |
|
|
style="margin-left: 8px; font-size: 12px;" |
|
|
:style="{ color: duplicateCount > 0 ? '#fa541c' : '#8c8c8c' }" |
|
|
> |
|
|
<template v-if="autoDuplicateLoading">查重中…</template> |
|
|
<template v-else-if="duplicateCount > 0">疑似重复 {{ duplicateCount }} 条</template> |
|
|
<template v-else>未发现重复</template> |
|
|
</span> |
|
|
|
|
|
</div> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<!-- 联系电话 + 被投诉二级机构 --> |
|
|
<el-row> |
|
|
<el-col :span="12"> |
|
|
<el-form-item label="联系电话" prop="responderPhone"> |
|
|
<el-input |
|
|
v-model="formData.responderPhone" |
|
|
:placeholder="formData.responderPhoneSkip ? '无' : '请输入联系电话'" |
|
|
:disabled="formData.responderPhoneSkip" |
|
|
@blur="onAutoCheckDuplicate" |
|
|
> |
|
|
<template #append> |
|
|
<el-checkbox |
|
|
v-model="formData.responderPhoneSkip" |
|
|
@change="(v) => v && (formData.responderPhone = '')" |
|
|
> |
|
|
无 |
|
|
</el-checkbox> |
|
|
</template> |
|
|
</el-input> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
|
|
|
<el-col :span="12"> |
|
|
<el-form-item label="被投诉二级机构" prop="secondDepartId" > |
|
|
<depart-tree-select |
|
|
v-model="formData.secondDepartId" |
|
|
:check-strictly="true" |
|
|
@node-click="(row) => (formData.secondDepartName = row.shortName)" |
|
|
/> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<!-- 来件内容 --> |
|
|
<el-row> |
|
|
<el-col :span="24"> |
|
|
<el-form-item label="来件内容" prop="thingDesc"> |
|
|
<el-input v-model="formData.thingDesc" type="textarea" :autosize="{ minRows: 4 }" /> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<!-- 涉嫌问题 + 是否重复件 --> |
|
|
<el-row> |
|
|
<el-col :span="12"> |
|
|
<el-form-item label="涉嫌问题" prop="involveProblemIdList"> |
|
|
<el-select v-model="formData.involveProblemIdList" multiple clearable style="width: 100%"> |
|
|
<el-option |
|
|
v-for="item in dict.suspectProblem" |
|
|
:key="item.dictValue" |
|
|
:value="item.dictValue" |
|
|
:label="item.dictLabel" |
|
|
> |
|
|
<!-- 复选框展示 --> |
|
|
<el-checkbox :model-value="(formData.involveProblemIdList || []).includes(item.dictValue)"> |
|
|
{{ item.dictLabel }} |
|
|
</el-checkbox> |
|
|
</el-option> |
|
|
</el-select> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
|
|
|
<el-col :span="12"> |
|
|
<el-form-item label="是否重复件" prop="repeatt"> |
|
|
<el-radio-group v-model="formData.repeatt" clearable> |
|
|
<el-radio v-for="item in dict.yesNo" :key="item.id" :label="item.dictValue"> |
|
|
{{ item.dictLabel }} |
|
|
</el-radio> |
|
|
</el-radio-group> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<!-- 标签 --> |
|
|
<el-row> |
|
|
<el-col :span="18"> |
|
|
<el-form-item label="标签" prop="tags"> |
|
|
<el-checkbox-group v-model="formData.tags"> |
|
|
<el-checkbox v-for="item in dict.sfssTags" :key="item.id" :label="item.dictValue"> |
|
|
{{ item.dictLabel }} |
|
|
</el-checkbox> |
|
|
</el-checkbox-group> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<!-- 办理方式 --> |
|
|
<el-row> |
|
|
<el-col :span="12"> |
|
|
<el-form-item label="办理方式" prop="handleMethod"> |
|
|
<el-radio-group v-model="formData.handleMethod" clearable> |
|
|
<el-radio v-for="item in dict.handleMethodType" :key="item.id" :label="item.dictValue"> |
|
|
{{ item.dictLabel }} |
|
|
</el-radio> |
|
|
</el-radio-group> |
|
|
</el-form-item> |
|
|
</el-col> |
|
|
</el-row> |
|
|
|
|
|
<el-form-item v-if="mode === 'add'" label="附件" prop="thingFiles"> |
|
|
<file-upload |
|
|
v-model:files="formData.thingFiles" |
|
|
tips="为便于“办理单位”更全面了解问题详情，请上传相关附件，如现场督察、数字督察等相关照片、视频及其他佐证材料。" |
|
|
/> |
|
|
</el-form-item> |
|
|
</div> |
|
|
|
|
|
<!-- 办理单位 --> |
|
|
<el-divider v-if="mode === 'add'" /> |
|
|
<h2 v-if="mode === 'add'">办理单位</h2> |
|
|
<div v-if="mode === 'add'" class="add-negation-container"> |
|
|
<el-form-item label="主办层级" prop="hostLevel" :rules="{ required: true, message: '请选择主办层级', trigger: ['blur'] }"> |
|
|
<el-select style="width: 280px" v-model="formData.hostLevel" @change="handleChangeHostLevel"> |
|
|
<el-option v-for="item in dict.hostLevel" :key="item.id" :label="item.dictLabel" :value="item.dictValue" /> |
|
|
</el-select> |
|
|
<div class="tips mt-10"> |
|
|
<p>如主办层级 为 市局主办， 则由<span :data-active="formData.hostLevel === HostLevel.FIRST">督察支队</span>办理；</p> |
|
|
<p>如主办层级为 二级机构主办，则由<span :data-active="formData.hostLevel === HostLevel.SECOND">督察部门</span>办理，可进一步下发；</p> |
|
|
<p>如主办层级为 三级机构主办，则由<span :data-active="formData.hostLevel === HostLevel.THREE">所队</span>办理。</p> |
|
|
</div> |
|
|
</el-form-item> |
|
|
<el-form-item label="指定办理单位" prop="departId" :rules="{ required: true, message: '请选择办理单位', trigger: ['blur'] }"> |
|
|
<div class="flex gap"> |
|
|
<div style="width: 280px"> |
|
|
<template v-if="formData.hostLevel === HostLevel.THREE"> |
|
|
<depart-tree-select v-model="formData.departId" v-loading="departLoading" /> |
|
|
</template> |
|
|
<el-tree-select v-else :data="departs" :props="{ label: 'shortName', value: 'id' }" node-key="id" clearable filterable v-model="formData.departId" @node-click="handleSelectDepart" check-strictly style="width: 280px" v-loading="departLoading" /> |
|
|
</div> |
|
|
<el-button type="primary" @click="handleLinkDepart" text v-if="formData.hostLevel !== HostLevel.FIRST">关联问题涉及单位</el-button> |
|
|
</div> |
|
|
<div class="tips mt-10"> |
|
|
<p>问题涉及单位 指与该问题相关的单位；</p> |
|
|
<p>指定办理单位 指将问题分派给哪个单位办理。</p> |
|
|
</div> |
|
|
</el-form-item> |
|
|
</div> |
|
|
|
|
|
<!-- 初核时限 --> |
|
|
<h2 v-if="mode === 'add'">初核时限</h2> |
|
|
<p v-if="mode === 'add'" style="color: #909399; font-size: 14px; line-height: 1.6; padding-left: 200px;"> |
|
|
该信件的初核时限需在<span style="color: var(--el-color-danger); font-weight: 600;"> 4个工作日 </span>之内完成初核。 |
|
|
</p> |
|
|
|
|
|
<!-- 办理时限 --> |
|
|
<h2 v-if="mode === 'add'">办理时限</h2> |
|
|
<div v-if="mode === 'add'" class="add-negation-container"> |
|
|
<el-form-item label="办理时限" prop="timeLimit" :rules="{ required: true, message: '请选择办理时限', trigger: ['blur'] }"> |
|
|
<time-limit-select :key="timeLimitKey" v-model="formData.timeLimit" v-model:maxSignDuration="formData.maxSignDuration" v-model:maxHandleDuration="formData.maxHandleDuration" v-model:maxExtensionDuration="formData.maxExtensionDuration" /> |
|
|
</el-form-item> |
|
|
</div> |
|
|
|
|
|
<!-- 审批流程 --> |
|
|
<h2 v-if="mode === 'add'">审批流程</h2> |
|
|
<div v-if="mode === 'add'" class="add-negation-container"> |
|
|
<el-form-item label="审批流程" prop="approvalFlow" :rules="{ required: true, message: '请选择审批流程', trigger: ['blur'] }"> |
|
|
<el-radio-group v-model="formData.approvalFlow" v-if="userStore.user.roleCodes.includes('admin_1')"> |
|
|
<el-radio v-for="item in dict.approvalFlow" :key="item.dictCode" :value="item.dictValue">{{ item.dictLabel }}{{ item.remark ? `(${item.remark})` : "" }}</el-radio> |
|
|
</el-radio-group> |
|
|
<el-radio-group v-model="formData.approvalFlow" v-else> |
|
|
<el-radio value="2">二级审批(所队一>二级机构)</el-radio> |
|
|
</el-radio-group> |
|
|
<div class="tips mt-10"> |
|
|
<p v-if="userStore.user.roleCodes.includes('admin_1')">三级审核 问题提交办结时，需经过"所队—>二级机构—>市局"三级审核，通过后方可办结；</p> |
|
|
<p>二级审核 问题提交办结时，仅需经过"所队—>二级机构"两级审核，通过后即可办结；</p> |
|
|
</div> |
|
|
</el-form-item> |
|
|
</div> |
|
|
</el-form> |
|
|
</el-scrollbar> |
|
|
|
|
|
<template #footer> |
|
|
<div class="dialog-footer"> |
|
|
<el-button @click="visibleProxy = false" size="large">取消</el-button> |
|
|
<el-button type="primary" @click="onSubmit" size="large" :loading="loading || submitLoading"> |
|
|
{{ mode === 'add' ? '添加' : '修改' }} |
|
|
</el-button> |
|
|
</div> |
|
|
</template> |
|
|
</el-dialog> |
|
|
|
|
|
<DuplicateDrawerWithDetail |
|
|
v-model="duplicateDrawerVisible" |
|
|
:dict="dict" |
|
|
:query="{ |
|
|
responderIdCode: formData.responderIdCode, |
|
|
responderName: formData.responderName, |
|
|
responderPhone: formData.responderPhone |
|
|
}" |
|
|
:requestFn="maileRepeatt" |
|
|
detailIdKey="negativeId" |
|
|
@opened-detail="handleDuplicateRowClick" |
|
|
/> |
|
|
|
|
|
|
|
|
<!-- 办理详情 --> |
|
|
<NegativeDialog |
|
|
v-model="detailDialogVisible" |
|
|
:id="detailNegativeId" |
|
|
@close="detailDialogVisible = false" |
|
|
/> |
|
|
|
|
|
<!-- 局长信箱办理详情 --> |
|
|
<NegativeMailboxDialog |
|
|
v-model="mailboxDetailVisible" |
|
|
:id="detailNegativeId" |
|
|
@close="mailboxDetailVisible = false" |
|
|
/> |
|
|
</template> |
|
|
|
|
|
<script setup> |
|
|
import {computed, ref, watch} from "vue"; |
|
|
import {maileRepeatt, getComplaintCollectionDetail, updateComplaintCollection, addComplaintCollection} from "@/api/data/complaintCollection.ts"; |
|
|
import dayjs from "dayjs"; |
|
|
import feedback from "@/utils/feedback.ts"; |
|
|
import DuplicateDrawerWithDetail from "@/views/data/DuplicateDrawerWithDetail.vue"; |
|
|
import useUserStore from "@/stores/modules/user.ts"; |
|
|
import {secondList, listByFirstHost} from "@/api/system/depart"; |
|
|
import useCatchStore from "@/stores/modules/catch"; |
|
|
const catchStore = useCatchStore(); |
|
|
|
|
|
// 内部表单数据 |
|
|
const formData = ref(createEmptyForm()); |
|
|
|
|
|
function createEmptyForm() { |
|
|
return { |
|
|
// 来源 |
|
|
sourcePath: [], |
|
|
sourceTable: '', |
|
|
sourceTableSubOne: '', |
|
|
// 编号 |
|
|
originId: '', |
|
|
originIdSkip: false, |
|
|
// 受理时间 |
|
|
discoveryTime: '', |
|
|
// 来件人 |
|
|
responderName: '', |
|
|
responderNameSkip: false, |
|
|
responderIdCode: '', |
|
|
responderIdCodeSkip: false, |
|
|
responderPhone: '', |
|
|
responderPhoneSkip: false, |
|
|
// 被投诉机构 |
|
|
secondDepartId: '', |
|
|
secondDepartName: '', |
|
|
// 内容 |
|
|
thingDesc: '', |
|
|
involveProblemIdList: [], |
|
|
repeatt: '', |
|
|
handleMethod: '', |
|
|
// 标签 |
|
|
tags: [], |
|
|
businessTypeCode: '', |
|
|
businessTypeName: '', |
|
|
// 附件 |
|
|
thingFiles: [], |
|
|
// 办理信息 |
|
|
hostLevel: '3', |
|
|
departId: '', |
|
|
departName: '', |
|
|
timeLimit: '', |
|
|
maxSignDuration: null, |
|
|
maxHandleDuration: null, |
|
|
maxExtensionDuration: null, |
|
|
approvalFlow: '', |
|
|
// 编辑时需要的 id |
|
|
id: '', |
|
|
negativeId: '', |
|
|
}; |
|
|
} |
|
|
|
|
|
// 内部校验规则 |
|
|
const rules = { |
|
|
sourcePath: [ |
|
|
{required: true, message: "请选择来源（一级/二级）", trigger: "change"}, |
|
|
], |
|
|
discoveryTime: [{required: true, message: '请选择受理时间', trigger: 'change'}], |
|
|
secondDepartId: [{required: true, message: '请选择被投诉二级机构', trigger: 'change'}], |
|
|
thingDesc: [{required: true, message: '请输入来件内容', trigger: 'blur'}], |
|
|
involveProblemIdList: [{required: true, message: '请选择涉嫌问题', trigger: 'change'}], |
|
|
repeatt: [{required: true, message: '请选择是否重复件', trigger: 'change'}], |
|
|
hostLevel: [{required: true, message: '请选择主办层级', trigger: 'change'}], |
|
|
departId: [{required: true, message: '请选择办理单位', trigger: 'change'}], |
|
|
timeLimit: [{required: true, message: '请选择办理时限', trigger: 'change'}], |
|
|
approvalFlow: [{required: true, message: '请选择审批流程', trigger: 'change'}], |
|
|
}; |
|
|
|
|
|
// 1. 用 computed 包装 storeDict |
|
|
const storeDict = computed(() => |
|
|
catchStore.getDicts([ |
|
|
"businessType", |
|
|
"suspectProblem", |
|
|
"specialSupervision", |
|
|
"checkStatus", |
|
|
"policeType", |
|
|
"timeLimit", |
|
|
"approvalFlow", |
|
|
"sfssSourceTable", |
|
|
"sfssTags", |
|
|
]) || {} |
|
|
); |
|
|
|
|
|
// 2. 本地静态字典 |
|
|
const localDict = { |
|
|
yesNo: [ |
|
|
{id: 1, dictLabel: "是", dictValue: "1"}, |
|
|
{id: 2, dictLabel: "否", dictValue: "0"}, |
|
|
], |
|
|
handleMethodType: [ |
|
|
{id: 1, dictLabel: "自办", dictValue: "0"}, |
|
|
{id: 2, dictLabel: "下发", dictValue: "1"}, |
|
|
], |
|
|
}; |
|
|
|
|
|
// 3. sourceTableAndLevel 依赖 storeDict.value |
|
|
const sourceTableAndLevel = computed(() => { |
|
|
const list = storeDict.value?.sfssSourceTable || []; |
|
|
if (!list || list.length === 0) return []; |
|
|
// 一级：remark 为空 |
|
|
const parents = list.filter(d => !d.remark); |
|
|
// 二级：remark 有值 |
|
|
const children = list.filter(d => d.remark); |
|
|
return parents.map(p => ({ |
|
|
label: p.dictLabel, |
|
|
value: String(p.dictValue), |
|
|
children: children |
|
|
.filter(c => String(c.remark) === String(p.dictValue)) |
|
|
.map(c => ({ |
|
|
label: c.dictLabel, |
|
|
value: String(c.dictValue), |
|
|
})), |
|
|
})); |
|
|
}); |
|
|
|
|
|
// 4. dict 合并 |
|
|
const dict = computed(() => ({ |
|
|
...storeDict.value, |
|
|
...localDict, |
|
|
sourceTableAndLevel: sourceTableAndLevel.value, |
|
|
})); |
|
|
|
|
|
const HostLevel = { |
|
|
FIRST: '1', |
|
|
SECOND: '2', |
|
|
THREE: '3' |
|
|
}; |
|
|
|
|
|
const userStore = useUserStore(); |
|
|
|
|
|
const props = defineProps({ |
|
|
modelValue: Boolean, |
|
|
mode: { type: String, default: "add" }, |
|
|
id: { type: String, default: "" }, |
|
|
negativeId: { type: String, default: "" }, |
|
|
loading: { type: Boolean, default: false }, |
|
|
}); |
|
|
|
|
|
const emit = defineEmits(["update:modelValue", "updateSuccess"]); |
|
|
|
|
|
const formRef = ref(); |
|
|
const submitLoading = ref(false); |
|
|
const timeLimitKey = ref(0); |
|
|
|
|
|
const visibleProxy = computed({ |
|
|
get: () => props.modelValue, |
|
|
set: (v) => emit("update:modelValue", v), |
|
|
}); |
|
|
|
|
|
watch( |
|
|
() => visibleProxy.value, |
|
|
async (v) => { |
|
|
if (v) { |
|
|
// 重置表单 |
|
|
timeLimitKey.value++ |
|
|
formData.value = createEmptyForm(); |
|
|
|
|
|
duplicateDrawerVisible.value = false |
|
|
duplicateLoading.value = false |
|
|
autoDuplicateLoading.value = false |
|
|
duplicateHintVisible.value = false |
|
|
duplicateCount.value = 0 |
|
|
duplicateCache.value = [] |
|
|
duplicateList.value = [] |
|
|
|
|
|
getDeparts() |
|
|
|
|
|
if (props.mode === 'edit' && (props.id || props.negativeId)) { |
|
|
try { |
|
|
const res = await getComplaintCollectionDetail({ id: props.id, negativeId: props.negativeId }); |
|
|
const r = res?.data ?? res ?? {}; |
|
|
|
|
|
formData.value.id = r.id ?? ''; |
|
|
formData.value.sourceTable = r.sourceTable ?? ''; |
|
|
formData.value.sourceTableSubOne = r.sourceTableSubOne ?? ''; |
|
|
formData.value.sourcePath = [r.sourceTable, r.sourceTableSubOne].filter(Boolean); |
|
|
formData.value.originId = r.originId ?? ''; |
|
|
formData.value.discoveryTime = r.discoveryTime ?? ''; |
|
|
formData.value.responderName = r.responderName ?? ''; |
|
|
formData.value.responderIdCode = r.responderIdCode ?? ''; |
|
|
formData.value.responderPhone = r.responderPhone ?? ''; |
|
|
formData.value.secondDepartId = r.secondDepartId ?? ''; |
|
|
formData.value.secondDepartName = r.secondDepartName ?? ''; |
|
|
formData.value.thingDesc = r.thingDesc ?? ''; |
|
|
formData.value.repeatt = r.repeatt ?? ''; |
|
|
formData.value.handleMethod = r.handleMethod ?? ''; |
|
|
formData.value.involveProblemIdList = splitToArray(r.involveProblemIdList ?? r.involveProblem); |
|
|
formData.value.tags = splitToArray(r.tags ?? r.tag); |
|
|
formData.value.businessTypeName = r.businessTypeName ?? ''; |
|
|
formData.value.businessTypeCode = r.businessTypeCode ?? ''; |
|
|
formData.value.thingFiles = normalizeThingFiles(r.thingFiles); |
|
|
formData.value.hostLevel = r.hostLevel ?? '3'; |
|
|
formData.value.departId = r.departId ?? ''; |
|
|
formData.value.departName = r.departName ?? ''; |
|
|
formData.value.timeLimit = r.timeLimit ?? ''; |
|
|
formData.value.maxSignDuration = r.maxSignDuration ?? null; |
|
|
formData.value.maxHandleDuration = r.maxHandleDuration ?? null; |
|
|
formData.value.maxExtensionDuration = r.maxExtensionDuration ?? null; |
|
|
formData.value.approvalFlow = r.approvalFlow ?? ''; |
|
|
formData.value.negativeId = r.negativeId ?? ''; |
|
|
} catch (e) { |
|
|
console.error("获取详情失败", e); |
|
|
feedback.notifyError("获取数据失败，请重试"); |
|
|
visibleProxy.value = false; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
); |
|
|
|
|
|
watch( |
|
|
() => formData.value.hostLevel, |
|
|
() => { |
|
|
getDeparts(); |
|
|
} |
|
|
); |
|
|
|
|
|
const departs = ref([]); |
|
|
const departLoading = ref(false); |
|
|
async function getDeparts() { |
|
|
if (!formData.value.hostLevel) return; |
|
|
departLoading.value = true; |
|
|
try { |
|
|
if (formData.value.hostLevel === HostLevel.FIRST) { |
|
|
departs.value = await listByFirstHost(); |
|
|
} else if (formData.value.hostLevel === HostLevel.SECOND) { |
|
|
departs.value = await secondList(); |
|
|
} else { |
|
|
departs.value = []; |
|
|
} |
|
|
} catch (e) { |
|
|
console.error(e); |
|
|
} finally { |
|
|
departLoading.value = false; |
|
|
} |
|
|
} |
|
|
|
|
|
function handleSelectDepart(row) { |
|
|
formData.value.departName = row.shortName; |
|
|
} |
|
|
|
|
|
function handleLinkDepart() { |
|
|
if (formData.value.hostLevel === HostLevel.SECOND) { |
|
|
feedback.msgWarning("当前选择二级机构主办，指定办理单位请选择二级机构！"); |
|
|
return; |
|
|
} |
|
|
formData.value.departId = formData.value.secondDepartId; |
|
|
formData.value.departName = formData.value.secondDepartName; |
|
|
} |
|
|
|
|
|
function handleChangeHostLevel(val) { |
|
|
if (val === HostLevel.FIRST) { |
|
|
formData.value.departId = ""; |
|
|
} |
|
|
if (val === HostLevel.SECOND) { |
|
|
formData.value.approvalFlow = "3"; |
|
|
} |
|
|
} |
|
|
|
|
|
watch( |
|
|
() => formData.value.sourcePath, |
|
|
(path) => { |
|
|
if (!path || path.length === 0) return; |
|
|
formData.value.sourceTable = (path && path[0]) || ""; |
|
|
formData.value.sourceTableSubOne = (path && path[1]) || ""; |
|
|
}, |
|
|
{ deep: true } |
|
|
); |
|
|
|
|
|
|
|
|
function fillFiledName() { |
|
|
const code = formData.value.businessTypeCode; |
|
|
const hit = dict.value?.businessType?.find( |
|
|
(d) => String(d.dictValue) === String(code) |
|
|
); |
|
|
formData.value.businessTypeName = hit?.dictLabel || ""; |
|
|
} |
|
|
|
|
|
function splitToArray(val) { |
|
|
if (!val) return []; |
|
|
if (Array.isArray(val)) return val; |
|
|
if (typeof val === 'string') { |
|
|
return val.split(/[,，]/).map(s => s.trim()).filter(Boolean); |
|
|
} |
|
|
return []; |
|
|
} |
|
|
|
|
|
function normalizeThingFiles(val) { |
|
|
if (!val) return []; |
|
|
if (Array.isArray(val)) return val.map(f => ({...f, loading: false, percent: 100})); |
|
|
if (typeof val === 'string' && val.trim().startsWith('[')) { |
|
|
try { |
|
|
return JSON.parse(val).map(f => ({...f, loading: false, percent: 100})); |
|
|
} catch {} |
|
|
} |
|
|
if (typeof val === 'string') { |
|
|
return val.split(/[,，]/).map(s => s.trim()).filter(Boolean).map(p => ({ |
|
|
filePath: p, |
|
|
fileName: p.split('/').pop() || p, |
|
|
loading: false, |
|
|
percent: 100, |
|
|
})); |
|
|
} |
|
|
return []; |
|
|
} |
|
|
|
|
|
async function onSubmit() { |
|
|
if (!formRef.value) return; |
|
|
try { |
|
|
await formRef.value.validate(); |
|
|
} catch { |
|
|
feedback.msgWarning("请完善必填信息"); |
|
|
return; |
|
|
} |
|
|
fillFiledName(); |
|
|
|
|
|
// 添加模式：内部调用 API |
|
|
if (props.mode === 'add') { |
|
|
submitLoading.value = true; |
|
|
try { |
|
|
await addComplaintCollection({...formData.value}); |
|
|
feedback.msgSuccess("添加成功"); |
|
|
visibleProxy.value = false; |
|
|
emit("updateSuccess"); |
|
|
} catch (e) { |
|
|
console.error("添加失败", e); |
|
|
} finally { |
|
|
submitLoading.value = false; |
|
|
} |
|
|
return; |
|
|
} |
|
|
|
|
|
// 修改模式：内部处理 API 调用 |
|
|
submitLoading.value = true; |
|
|
try { |
|
|
await updateComplaintCollection({...formData.value}); |
|
|
feedback.msgSuccess("修改成功"); |
|
|
visibleProxy.value = false; |
|
|
emit("updateSuccess"); |
|
|
} catch (e) { |
|
|
console.error("修改失败", e); |
|
|
} finally { |
|
|
submitLoading.value = false; |
|
|
} |
|
|
} |
|
|
|
|
|
// 查重 |
|
|
const duplicateDrawerVisible = ref(false) |
|
|
const duplicateList = ref([]) |
|
|
const duplicateLoading = ref(false) |
|
|
const onCheckDuplicate = async () => { |
|
|
duplicateDrawerVisible.value = true |
|
|
} |
|
|
|
|
|
const duplicateCount = ref(0) |
|
|
const duplicateCache = ref([]) |
|
|
const autoDuplicateLoading = ref(false) |
|
|
const duplicateHintVisible = ref(false) |
|
|
|
|
|
|
|
|
const fetchDuplicate = async () => { |
|
|
const body = { |
|
|
responderIdCode: formData.value.responderIdCode, |
|
|
responderName: formData.value.responderName, |
|
|
responderPhone: formData.value.responderPhone, |
|
|
} |
|
|
|
|
|
const res = await maileRepeatt(body) |
|
|
return res?.complaintCollectionRepeatDTOS || [] |
|
|
} |
|
|
|
|
|
const onAutoCheckDuplicate = async () => { |
|
|
const { responderIdCode, responderName, responderPhone } = formData.value |
|
|
|
|
|
if (!responderIdCode && !responderName && !responderPhone) { |
|
|
duplicateCount.value = 0 |
|
|
duplicateCache.value = [] |
|
|
duplicateHintVisible.value = false |
|
|
return |
|
|
} |
|
|
|
|
|
duplicateHintVisible.value = true |
|
|
autoDuplicateLoading.value = true |
|
|
try { |
|
|
const list = await fetchDuplicate() |
|
|
duplicateCount.value = list.length |
|
|
duplicateCache.value = list |
|
|
} catch (e) { |
|
|
} finally { |
|
|
autoDuplicateLoading.value = false |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 查重结果的详情弹窗 |
|
|
const detailDialogVisible = ref(false) |
|
|
const mailboxDetailVisible = ref(false) |
|
|
const detailNegativeId = ref("") |
|
|
|
|
|
// 处理查重行点击事件 |
|
|
const handleDuplicateRowClick = (row) => { |
|
|
// 复用 ComplaintCollection.vue 中的逻辑 |
|
|
if (row.problemSources === '局长信箱') { |
|
|
mailboxDetailVisible.value = true |
|
|
detailNegativeId.value = row.originId |
|
|
} else { |
|
|
detailDialogVisible.value = true |
|
|
detailNegativeId.value = row.negativeId |
|
|
} |
|
|
} |
|
|
|
|
|
</script> |
|
|
|
|
|
<style lang="scss" scoped> |
|
|
.form-layout { |
|
|
padding: 0 34px; |
|
|
} |
|
|
|
|
|
.dialog-footer { |
|
|
padding: 16px 24px 24px; |
|
|
} |
|
|
|
|
|
.add-negation-container { |
|
|
padding: 0 60px; |
|
|
} |
|
|
|
|
|
.tips { |
|
|
margin-top: 10px; |
|
|
|
|
|
[data-active="true"] { |
|
|
color: var(--danger-color); |
|
|
} |
|
|
} |
|
|
|
|
|
:deep() { |
|
|
.el-form-item__content { |
|
|
flex-direction: column; |
|
|
align-items: flex-start; |
|
|
} |
|
|
.block.el-radio-group { |
|
|
display: block; |
|
|
} |
|
|
.block.el-radio-group .el-radio { |
|
|
display: block; |
|
|
} |
|
|
} |
|
|
|
|
|
.duplicate-drawer { |
|
|
--el-drawer-padding-primary: 20px; |
|
|
} |
|
|
|
|
|
.drawer-header { |
|
|
display: flex; |
|
|
align-items: center; |
|
|
gap: 8px; |
|
|
font-size: 18px; |
|
|
font-weight: 600; |
|
|
color: #d46b08; |
|
|
} |
|
|
|
|
|
.drawer-body { |
|
|
padding-top: 8px; |
|
|
} |
|
|
|
|
|
.drawer-alert { |
|
|
margin-bottom: 16px; |
|
|
} |
|
|
|
|
|
.id-highlight { |
|
|
margin-bottom: 20px; |
|
|
padding: 12px 16px; |
|
|
background: #fafafa; |
|
|
border-left: 4px solid #faad14; |
|
|
font-size: 14px; |
|
|
line-height: 22px; |
|
|
} |
|
|
|
|
|
.id-highlight span { |
|
|
margin-left: 8px; |
|
|
font-weight: 600; |
|
|
color: #d4380d; |
|
|
} |
|
|
|
|
|
.drawer-header.danger { |
|
|
color: #0d73ee; |
|
|
} |
|
|
|
|
|
.drawer-header .title-group { |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
} |
|
|
|
|
|
.drawer-header .title { |
|
|
font-size: 20px; |
|
|
font-weight: 600; |
|
|
line-height: 1.2; |
|
|
} |
|
|
|
|
|
.drawer-header .sub-title { |
|
|
font-size: 13px; |
|
|
color: #8c8c8c; |
|
|
margin-top: 2px; |
|
|
} |
|
|
|
|
|
h2 { |
|
|
margin: 16px 0 8px; |
|
|
padding-left: 60px; |
|
|
font-size: 16px; |
|
|
font-weight: 600; |
|
|
} |
|
|
</style>
|
|
|
|
