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.
271 lines
6.9 KiB
271 lines
6.9 KiB
<template> |
|
<view class="wrapper" v-if="show"> |
|
<view class="header text-center"> |
|
<fui-icon name="arrowleft" color="#fff" :size="50" @tap="show = false"></fui-icon> |
|
<text>认定办结</text> |
|
</view> |
|
<view class="body"> |
|
<view class="cell"> |
|
<view class="h2"> |
|
<text>办理反馈情况</text> |
|
</view> |
|
<view class="row flex wrap"> |
|
<view class="col-12 mb-6 flex"> |
|
<text class="label">群众反应事项解决情况</text> |
|
<text>{{ mail.verifyIsResolved ? "已解决" : "未解决" }}</text> |
|
</view> |
|
<view class="col-12 mb-6 flex"> |
|
<text class="label">办理反馈情况</text> |
|
<text>{{ mail.verifyFeedback }}</text> |
|
</view> |
|
<view class="col-12 mb-6 flex"> |
|
<text class="label">回访人姓名</text> |
|
<text>{{ mail.verifyFollowupPolice?.name }}</text> |
|
</view> |
|
<view class="col-12 mb-6 flex"> |
|
<text class="label">回访人电话</text> |
|
<text>{{ mail.verifyFollowupPolice?.phone }}</text> |
|
</view> |
|
<view class="col-12 mb-6 flex"> |
|
<text class="label">回访人警号</text> |
|
<text>{{ mail.verifyFollowupPolice?.empNo }}</text> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<uni-forms :label-width="100" :modelValue="formData" :rules="rules" ref="formRef"> |
|
<view class="cell mt-6" v-if="mail.verifyIsTrue === '属实' || mail.verifyIsTrue === '基本属实'"> |
|
<view class="h2"> |
|
<text>查证属实问题</text> |
|
</view> |
|
<mail-label-check :labels="verifyProblems" v-model="formData.verifyProblem" /> |
|
</view> |
|
|
|
<view class="cell mt-6"> |
|
<view class="h2"> |
|
<text>综合认定情况</text> |
|
</view> |
|
<uni-forms-item label="办理合格情况" name="qualifiedProcessingStatus" > |
|
<uni-data-select :localdata="qualifiedProcessingStatuss" placeholder="请选择办理合格情况" v-model="formData.qualifiedProcessingStatus" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="问题解决情况" name="problemSolvingStatus" > |
|
<uni-data-select :localdata="[{text: '已解决', value: true}, {text: '未解决', value: false}]" placeholder="请选择问题解决情况" v-model="formData.problemSolvingStatus"/> |
|
</uni-forms-item> |
|
<uni-forms-item label="群众回复情况" name="satisfactionStatus" > |
|
<uni-data-select :localdata="satisfactionStatuss" placeholder="请选择群众回复情况" v-model="formData.satisfactionStatus"/> |
|
</uni-forms-item> |
|
<view style="font-size: 14px; margin-left: 106px; margin-top: 10px;">{{ getSatisfaction() }}</view> |
|
</view> |
|
<view class="cell mb-6"> |
|
<view class="h2 relative mb-10"> |
|
<text>信件标签</text> |
|
<view class="add-label-btn" @tap="showAddMailLabel">添加标签</view> |
|
</view> |
|
<mail-label-check :labels="labels" v-model="formData.mailLabels" :map="{text: 'labelName', value: 'id'}" /> |
|
</view> |
|
<view class="cell mb-6"> |
|
<view class="h2 relative"> |
|
<text>认定办结意见</text> |
|
</view> |
|
<uni-forms-item name="completionComment"> |
|
<textarea placeholder="请输入认定办结意见" v-model="formData.completionComment" class="mb-6"></textarea> |
|
</uni-forms-item> |
|
</view> |
|
</uni-forms> |
|
</view> |
|
<view class="footer flex end"> |
|
<view class="flex gap"> |
|
<m-button size="large" @tap="show = false">取消</m-button> |
|
<m-button size="large" type="primary" @tap="submit">认定办结</m-button> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<m-popup ref="addMailLaeblRef" title="信件标签" placeholder="请输入标签内容" @confirm="handleAddMailLabel" /> |
|
</template> |
|
|
|
<script setup> |
|
import { reactive, ref, inject, watch } from "vue"; |
|
import { getLeaderList } from '@/api/user' |
|
import { labelLists, labelAdd } from "@/api/label"; |
|
import { getDictOptions } from '@/common/dict' |
|
const satisfactionStatuss = getDictOptions('satisfaction_status') |
|
const qualifiedProcessingStatuss = getDictOptions('qualified_processing_status') |
|
const verifyProblems = getDictOptions('verify_problem') |
|
|
|
const mail = inject("mail"); |
|
|
|
const formData = reactive({ |
|
verifyProblem: mail.value.verifyProblem |
|
}) |
|
watch(() => mail.value.verifyProblem, val => { |
|
formData.verifyProblem = val |
|
}) |
|
const formRef = ref() |
|
const rules = { |
|
qualifiedProcessingStatus: { |
|
rules:[ |
|
{ |
|
required: true, |
|
errorMessage: '请选择办理合格情况', |
|
} |
|
] |
|
}, |
|
problemSolvingStatus: { |
|
rules:[ |
|
{ |
|
required: true, |
|
errorMessage: '请选择问题解决情况', |
|
} |
|
] |
|
}, |
|
satisfactionStatus: { |
|
rules:[ |
|
{ |
|
required: true, |
|
errorMessage: '请选择群众回复情况', |
|
} |
|
] |
|
}, |
|
completionComment: { |
|
rules:[ |
|
{ |
|
required: true, |
|
errorMessage: '请输入认定办结意见', |
|
} |
|
] |
|
} |
|
} |
|
const show = ref(false) |
|
const leaders = ref([]) |
|
|
|
const addMailLaeblRef = ref() |
|
watch(() => mail.value.flowKey, (val) => { |
|
getLeaderList(val === 'second_approval' ? 'deputy' : 'leader').then(data => { |
|
leaders.value = data |
|
}) |
|
}) |
|
|
|
const props = defineProps({ |
|
modelValue: { |
|
type: Object |
|
} |
|
}) |
|
const emit = defineEmits(['update:modelValue', 'submit']) |
|
|
|
function submit() { |
|
formRef.value.validate().then(res => { |
|
console.log(formData) |
|
emit('update:modelValue', formData) |
|
emit('submit', 'confirmedCompletion') |
|
show.value = false |
|
}) |
|
} |
|
|
|
function showAddMailLabel() { |
|
addMailLaeblRef.value.open() |
|
} |
|
|
|
const labels = ref([]) |
|
getLabelList() |
|
function getLabelList() { |
|
labelLists().then(data => { |
|
labels.value = data |
|
}) |
|
} |
|
|
|
function handleAddMailLabel(val) { |
|
labelAdd({labelName: val}).then(() => { |
|
addMailLaeblRef.value.close() |
|
getLabelList() |
|
}) |
|
} |
|
|
|
function open() { |
|
show.value = true |
|
} |
|
|
|
const SATISFACTION = { |
|
not_satisfied: "不满意", |
|
basically_satisfied: "基本满意", |
|
satisfied: "非常满意", |
|
}; |
|
|
|
function getSatisfaction() { |
|
if (!mail.value.satisfaction) { |
|
return ""; |
|
} |
|
return SATISFACTION[mail.value.satisfaction] + '(网络)'; |
|
} |
|
|
|
defineExpose({ |
|
open |
|
}) |
|
</script> |
|
|
|
<style lang="scss"> |
|
.wrapper { |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
right: 0; |
|
bottom: 0; |
|
background: #F1F1F1; |
|
z-index: 3; |
|
.header { |
|
background-color: var(--primary-color); |
|
color: #fff; |
|
height: 46px; |
|
line-height: 46px; |
|
position: relative; |
|
padding-top: 40px; |
|
.fui-icon { |
|
position: absolute; |
|
left: 10px; |
|
} |
|
} |
|
.body { |
|
height: calc(100vh - 136px); |
|
overflow: auto; |
|
font-size: 11px; |
|
.h2 { |
|
padding: 6px 0; |
|
text { |
|
font-size: 12px; |
|
font-weight: 700; |
|
ine-height: 17px; |
|
} |
|
} |
|
.label { |
|
line-height: 1.1; |
|
} |
|
.add-label-btn { |
|
position: absolute; |
|
top: 0; |
|
right: 0; |
|
font-size: 12px; |
|
color: var(--primary-color); |
|
padding: 6px; |
|
} |
|
textarea { |
|
border: 1px solid #ddd; |
|
padding: 12px; |
|
height: 80px; |
|
font-size: 14px; |
|
border-radius: 2px; |
|
} |
|
|
|
} |
|
.footer { |
|
background-color: #fff; |
|
padding: 9px 12px; |
|
border-top: 1px solid #e5e5e5; |
|
} |
|
|
|
} |
|
:deep() { |
|
.no-label { |
|
width: 0 !important; |
|
} |
|
} |
|
</style> |