wxc
1 year ago
11 changed files with 312 additions and 74 deletions
@ -0,0 +1,88 @@
|
||||
<template> |
||||
<el-dialog width="50vw" title="发起单位会签" v-model="show"> |
||||
<el-form :model="formData" ref="formRef"> |
||||
<el-form-item |
||||
label="会签具体要求" |
||||
:rules="{ |
||||
required: true, |
||||
message: '请输入会签具体要求', |
||||
trigger: ['blur'], |
||||
}" |
||||
label-position="top" |
||||
prop="requirement" |
||||
> |
||||
<el-input |
||||
type="textarea" |
||||
:autosize="{ minRows: 4 }" |
||||
placeholder="请输入单位会签提议，如对问题处理结果存疑的地方，希望哪些单位提供专业意见等。" |
||||
v-model="formData.requirement" |
||||
/> |
||||
</el-form-item> |
||||
<el-form-item |
||||
label="参与会签单位" |
||||
:rules="{ |
||||
required: true, |
||||
message: '请选择参与会签单位' |
||||
}" |
||||
label-position="top" |
||||
prop="countersignDeparts" |
||||
> |
||||
<div style="min-height: 200px"> |
||||
<div class="flex gap-20 mb-10" v-for="(item, index) in formData.countersignDeparts" :key="index"> |
||||
<div style="width: 280px"> |
||||
<depart-tree-select v-model="item.id" /> |
||||
</div> |
||||
<el-button type="primary" plain v-if="index === 0" @click="handleAddDepart"> |
||||
<template #icon> |
||||
<icon name="el-icon-Plus" /> |
||||
</template> |
||||
添加单位</el-button |
||||
> |
||||
<el-button type="danger" plain v-else @click="handleRemoveDepart"> |
||||
<template #icon> |
||||
<icon name="el-icon-Delete" /> |
||||
</template> |
||||
删除单位</el-button |
||||
> |
||||
</div> |
||||
</div> |
||||
</el-form-item> |
||||
</el-form> |
||||
|
||||
<footer class="flex end"> |
||||
<el-button type="primary" size="large" @click="submit" |
||||
>发起会签</el-button |
||||
> |
||||
</footer> |
||||
</el-dialog> |
||||
</template> |
||||
<script setup> |
||||
const emit = defineEmits(["submit"]); |
||||
const show = ref(false); |
||||
|
||||
const formData = ref({ |
||||
countersignDeparts: [{}] |
||||
}) |
||||
const formRef = ref() |
||||
|
||||
function handleAddDepart() { |
||||
formData.value.countersignDeparts.push({}) |
||||
} |
||||
|
||||
function handleRemoveDepart(index) { |
||||
formData.value.countersignDeparts.splice(index, 1) |
||||
} |
||||
async function submit() { |
||||
await formRef.value.validate(); |
||||
show.value = false; |
||||
emit("submit", formData.value); |
||||
} |
||||
|
||||
async function open() { |
||||
show.value = true; |
||||
} |
||||
|
||||
defineExpose({ |
||||
open, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,82 @@
|
||||
<template> |
||||
<el-collapse v-model="activeNames"> |
||||
<el-collapse-item |
||||
v-for="(item, index) in countersignApplys" |
||||
:key="index" |
||||
:title="`单位会签${index + 1}`" |
||||
:name="`countersign${index}`" |
||||
> |
||||
<div class="row"> |
||||
<div class="col col-6"> |
||||
<label>会签发起人</label> |
||||
<span>{{ item.creatorName }}</span> |
||||
</div> |
||||
<div class="col col-6"> |
||||
<label>发起时间</label> |
||||
<span>{{ item.createTime }}</span> |
||||
</div> |
||||
<div class="col col-12"> |
||||
<label>会签单位</label> |
||||
<span> |
||||
<div |
||||
v-for="depart in item.countersigns" |
||||
:key="depart" |
||||
class="flex gap wrap" |
||||
> |
||||
<span>{{ depart.departName }}</span> |
||||
<span |
||||
>({{ |
||||
depart.state === "uncompleted" |
||||
? "未提交" |
||||
: "已提交" |
||||
}})</span |
||||
> |
||||
</div> |
||||
</span> |
||||
</div> |
||||
<div class="col col-24"> |
||||
<label>会签具体要求</label> |
||||
<span>{{ item.requirement }}</span> |
||||
</div> |
||||
</div> |
||||
<div |
||||
v-for="countersign in item.countersigns.filter( |
||||
(obj) => obj.state !== 'uncompleted' |
||||
)" |
||||
:key="countersign" |
||||
> |
||||
<div class="text-primary mb-8"> |
||||
{{ countersign.departName }}的会签意见 |
||||
</div> |
||||
<div class="text-wrap mb-10">{{ countersign.comments }}</div> |
||||
<div class="row" v-if="countersign.files"> |
||||
<div class="col col-24"> |
||||
<label>附件</label> |
||||
<span> |
||||
<file-list :files="JSON.parse(countersign.files)" /> |
||||
</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</el-collapse-item> |
||||
</el-collapse> |
||||
</template> |
||||
<script setup> |
||||
import { onMounted } from "vue"; |
||||
|
||||
const countersignApplys = inject("countersignApplys"); |
||||
|
||||
const activeNames = ref([]); |
||||
watch(countersignApplys, () => { |
||||
for (let i = 0; i < countersignApplys.value.length; i++) { |
||||
console.log(i) |
||||
activeNames.value.push(`countersign${i}`); |
||||
} |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
.el-collapse { |
||||
--el-collapse-header-text-color: var(--primary-color); |
||||
--el-collapse-header-font-size: 16px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,33 @@
|
||||
<template> |
||||
<el-form :model="formData" ref="formRef" label-width="108" class="mt-10"> |
||||
<el-form-item label="会签意见" prop="comments" :rules="{ |
||||
required: true, |
||||
message: '请输入会签意见', |
||||
trigger: ['blur']}"> |
||||
<el-input |
||||
type="textarea" |
||||
placeholder="请输入会签意见" |
||||
:autosize="{ minRows: 4 }" |
||||
v-model="formData.comments" |
||||
/> |
||||
</el-form-item> |
||||
<el-form-item label="附件"> |
||||
<file-upload v-model:files="formData.files" /> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
<script setup> |
||||
const formData = ref({}); |
||||
const formRef = ref(); |
||||
|
||||
async function validate() { |
||||
await formRef.value.validate(); |
||||
return formData.value; |
||||
} |
||||
|
||||
defineExpose({ |
||||
validate |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
</style> |
||||
Loading…
Reference in new issue