This commit is contained in:
yanran200730
2022-12-19 14:12:11 +08:00
parent 4a434b4009
commit 97fd249134
2 changed files with 564 additions and 2 deletions

View File

@@ -52,12 +52,108 @@
<el-table-column slot="options" width="120px" fixed="right" label="操作" align="center">
<template slot-scope="{ row }">
<div class="table-options">
<el-button type="text" @click="audit(row.id)" v-if="row.examineStatus === '0'">审核</el-button>
<el-button type="text" @click="toDetail(row.id)">详情</el-button>
<el-button type="text" v-if="row.status === '1'" @click="changeStatus(row.id)">停止</el-button>
</div>
</template>
</el-table-column>
</ai-table>
<ai-dialog
:visible.sync="isShowForm"
customFooter
@onConfirm="onConfirm"
width="800px"
title="表单">
<div class="middle-content form">
<div class="middle-content__wrapper">
<div>
<div class="left-item__item left-item__item--banner" key="banner" v-if="tempInfo.headPicture">
<img :src="tempInfo.headPicture">
</div>
<div class="left-item__item left-item__item--formname" key="title">
<h2>{{ tempInfo.title }}</h2>
</div>
<div class="left-item__item left-item__item--text" key="text">
<p>{{ tempInfo.tableExplain }}</p>
</div>
</div>
<div
class="group"
v-for="(data, index) in targetList"
:key="index">
<h2>{{ index }}</h2>
<div class="render-form">
<div class="render-form__item" v-for="(group, name) in data" :key="name">
<h2 class="render-form__title" v-if="name !== '0'">{{ name }}</h2>
<div
class="left-item__item components-item"
v-for="(item, i) in group"
:key="i">
<div class="left-item__item--title">
<i :style="{opacity: item.mustFill === '1' ? 1 : 0}">*</i>
<span>{{ i + 1 }}.</span>
<h2>{{ item.fieldName }}</h2>
</div>
<p class="text" v-if="item.explain">{{ item.explain }}</p>
<div class="left-item__item--wrapper">
<template v-if="(item.fieldType === 'radio')">
<el-radio-group v-model="item.fieldValue" :disabled="item.inputType !== '2'">
<el-radio :label="v.dictName" v-for="v in dict.getDict(item.dictionaryCode)" :key="v.dictName">{{ v.dictName }}</el-radio>
</el-radio-group>
</template>
<template v-if="(item.fieldType === 'date')">
<el-date-picker
v-model="item.fieldValue"
value-format="yyy-MM-DD"
type="date"
:disabled="item.inputType !== '2'"
:placeholder="`请选择${item.fieldName}`">
</el-date-picker>
</template>
<template v-if="(item.fieldType === 'score')">
<el-input-number :disabled="item.inputType !== '2'" style="width: 300px" size="small" :placeholder="`请输入${item.fieldName}`" v-model="item.fieldValue" :precision="1" :step="0.1" :max="10"></el-input-number>
</template>
<template v-if="item.fieldType === 'upload'">
<img style="width: 100%; height: 100%;" :src="formInfo[`field_${i}`]" v-if="formInfo[`field_${i}`]">
<div class="left-item__item--upload" v-else>
<span>图片</span>
</div>
</template>
<template v-if="item.fieldType === 'select'">
<ai-select
v-model="item.fieldValue"
:disabled="item.inputType !== '2'"
:placeholder="`请输入${item.fieldName}`"
:selectList="dict.getDict(item.dictionaryCode)">
</ai-select>
</template>
<template v-if="(item.fieldType === 'checkbox')">
<el-checkbox-group :disabled="item.inputType !== '2'" v-model="item.fieldValue">
<el-checkbox :label="v.dictName" v-for="v in dict.getDict(item.dictionaryCode)" :key="v.dictName">{{ v.dictName }}</el-checkbox>
</el-checkbox-group>
</template>
<template v-if="(item.fieldType === 'sign')">
<AiDrawer :index="i" v-if="item.inputType === '2'"></AiDrawer>
<img v-else style="width: 200px; height: 200px" :src="item.fieldValue" />
</template>
<template v-if="(item.fieldType === 'input')">
<el-input :disabled="item.inputType !== '2'" size="small" :placeholder="`请输入${item.fieldName}`" v-model="item.fieldValue"></el-input>
</template>
<template v-if="(item.fieldType === 'textarea')">
<el-input :disabled="item.inputType !== '2'" size="small" type="textarea" :placeholder="`请输入${item.fieldName}`" v-model="item.fieldValue"></el-input>
</template>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="dialog-footer" slot="footer">
<el-button @click="onCancel">拒绝</el-button>
<el-button @click="onConfirm" type="primary" style="width: 92px;">通过</el-button>
</div>
</ai-dialog>
</template>
</ai-card>
</template>
@@ -65,9 +161,14 @@
</template>
<script>
import RenderForm from './RenderForm'
export default {
name: 'Detail',
components: {
RenderForm
},
props: {
instance: Function,
dict: Object,
@@ -76,6 +177,7 @@
data () {
return {
targetList: {},
info: {},
search: {
current: 1,
@@ -83,6 +185,7 @@
name: '',
status: ''
},
isShowForm: false,
dictList: [{
dictName: '未填写',
dictValue: '0'
@@ -113,7 +216,9 @@
},
{prop: 'examineUserName', label: '审核人', align: 'center' },
],
list: []
tempInfo: {},
list: [],
filedList: []
}
},
@@ -129,10 +234,64 @@
},
methods: {
unique (arr) {
return arr.filter((item, index) => {
return arr.indexOf(item, 0) === index && !!item
})
},
onCancel () {
const list = this.filedList.filter(v => v.inputType === '2')
for (let i = 0; i < list.length; i++) {
if (list[i].mustFill === '1' && !list[i].fieldValue) {
return this.$message.error(`${list[i].fieldName}不能为空`)
}
}
this.instance.post(`/app/appassessmentscorev2task/examine`, {
taskDetailId: this.taskDetailId,
fields: list,
pass: false
}).then(res => {
if (res.code === 0) {
this.isShowForm = false
this.$message.success('审批成功')
}
})
},
onConfirm () {
const list = this.filedList.filter(v => v.inputType === '2')
for (let i = 0; i < list.length; i++) {
if (list[i].mustFill === '1' && !list[i].fieldValue) {
return this.$message.error(`${list[i].fieldName}不能为空`)
}
}
this.instance.post(`/app/appassessmentscorev2task/examine`, {
taskDetailId: this.taskDetailId,
fields: filedList,
pass: true
}).then(res => {
if (res.code === 0) {
this.isShowForm = false
this.$message.success('审批成功')
}
})
},
getInfo () {
this.instance.post(`/app/appassessmentscorev2task/queryDetailById?id=${this.params.id}`).then(res => {
if (res.code === 0) {
this.info = res.data
this.instance.post(`/app/appassessmentscorev2template/queryDetailById?id=${res.data.templateId}`).then(res => {
if (res.code == 0) {
this.tempInfo = res.data
}
})
}
this.isLoading = false
@@ -142,6 +301,55 @@
},
audit (id) {
this.instance.post(`/app/appassessmentscorev2task/queryDataInfoById2`, null, {
params: {
taskDetailId: id
}
}).then(res => {
if (res.code == 0) {
let list = {}
const filedList = res.data.filter(v => {
return v.inputType < 3
})
this.filedList = filedList
const dicts = filedList.filter(v => v.dictionaryCode).map(v => v.dictionaryCode)
this.dict.load(dicts)
let groups = this.unique(filedList.map(v => v.groupLevel1Name))
groups.forEach(item => {
let arr = {}
if (!list[item]) {
list[item] = []
}
const groupList = filedList.filter(v => v.groupLevel1Name === item)
const groups2 = this.unique(groupList.map(v => v.groupLevel2Name))
if (groups2.length) {
groups2.forEach(v => {
if (!arr[v]) {
arr[v] = []
}
arr[v] = groupList.filter(e => v === e.groupLevel2Name)
})
list[item] = arr
} else {
list[item] = {
'0': groupList
}
}
})
this.targetList = list
}
})
this.taskDetailId = id
this.isShowForm = true
},
sendTips () {
this.instance.post(`/app/appassessmentscorev2task/remindUnFill`, null, {
params: {
@@ -179,4 +387,170 @@
</script>
<style scoped lang="scss">
.form { .render-form {
.render-form__title {
font-size: 15px;
font-weight: 600;
color: #333;
}
.render-form__item {
margin-bottom: 12px;
}
.left-item__item--formname {
margin: 16px 0 32px;
padding: 0 12px;
color: #333333;
font-size: 15px;
font-weight: normal;
text-align: center;
word-break: break-all;
}
.left-item__item--text {
line-height: 20px;
// margin-bottom: 48px;
padding: 0 12px 20px;
text-align: justify;
color: #666;
font-size: 14px;
word-break: break-all;
}
.left-item__item--title {
display: flex;
margin-bottom: 10px;
i {
position: relative;
top: 3px;
margin-right: 5px;
color: #E22120;
}
span {
position: relative;
top: 3px;
}
h2 {
color: #333333;
font-size: 15px;
font-weight: 600;
}
}
.left-item__item--upload {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 120px;
height: 120px;
border-radius: 6px;
border: 1px dashed #bbb;
i {
font-size: 24px;
color: #8899bb;
}
span {
margin-top: 4px;
font-size: 12px;
color: #555;
}
}
.components-item {
position: relative;
padding: 8px 0px;
& > p {
margin-bottom: 10px;
padding: 0 12px;
font-size: 14px;
white-space: break-spaces;
color: #666;
}
.left-item__item--wrapper {
padding: 0 10px;
& > img {
max-width: 300px;
}
}
.left-item__item--upload {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 120px;
height: 120px;
border-radius: 6px;
border: 1px dashed #bbb;
i {
font-size: 24px;
color: #8899bb;
}
span {
margin-top: 4px;
font-size: 12px;
color: #555;
}
}
}
}
.left-item__item--banner {
img {
width: 100%;
height: 235px;
}
.config-item__banner {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 100%;
height: 235px;
line-height: 1;
border: 1px dashed #bbb;
span {
margin-top: 4px;
color: #555555;
font-size: 14px;
}
i {
font-size: 30px;
color: #8899bb;
}
}
}
.left-item__item--formname {
margin: 16px 0 32px;
padding: 0 12px;
color: #333333;
font-size: 15px;
font-weight: normal;
text-align: center;
word-break: break-all;
}
.group {
h2 {
margin-bottom: 10px;
font-size: 17px;
font-weight: 700;
color: #333;
}
}
}
</style>

View File

@@ -0,0 +1,188 @@
<template>
<div class="render-form">
<div class="render-form__item" v-for="(group, name) in data" :key="name">
<h2 class="render-form__title" v-if="name !== '0'">{{ name }}</h2>
<div
class="left-item__item components-item"
v-for="(item, i) in group"
:key="i">
<div class="left-item__item--title">
<i :style="{opacity: item.mustFill === '1' ? 1 : 0}">*</i>
<span>{{ i + 1 }}.</span>
<h2>{{ item.fieldName }}</h2>
</div>
<p class="text" v-if="item.explain">{{ item.explain }}</p>
<div class="left-item__item--wrapper">
<template v-if="(item.fieldType === 'radio')">
<el-radio-group v-model="formInfo[`field_${i}`]">
<el-radio :label="v.dictName" v-for="v in dict.getDict(item.dictionaryCode)" :key="v.dictName">{{ v.dictName }}</el-radio>
</el-radio-group>
</template>
<template v-if="(item.fieldType === 'score')">
<el-input-number style="width: 300px" size="small" :placeholder="`请输入${item.fieldName}`" v-model="formInfo[`field_${i}`]" :precision="1" :step="0.1" :max="10"></el-input-number>
</template>
<template v-if="item.fieldType === 'upload'">
<img style="width: 100%; height: 100%;" :src="formInfo[`field_${i}`]" v-if="formInfo[`field_${i}`]">
<div class="left-item__item--upload" v-else>
<span>图片</span>
</div>
</template>
<template v-if="item.fieldType === 'select'">
<ai-select
v-model="formInfo[`field_${i}`]"
:placeholder="`请输入${item.fieldName}`"
:selectList="dict.getDict(item.dictionaryCode)">
</ai-select>
</template>
<template v-if="(item.fieldType === 'checkbox')">
<el-checkbox-group v-model="formInfo[`field_${i}`]">
<el-checkbox :label="v.dictName" v-for="v in dict.getDict(item.dictionaryCode)" :key="v.dictName">{{ v.dictName }}</el-checkbox>
</el-checkbox-group>
</template>
<template v-if="(item.fieldType === 'sign')">
<AiDrawer></AiDrawer>
</template>
<template v-if="(item.fieldType === 'input')">
<el-input size="small" :placeholder="`请输入${item.fieldName}`" v-model="formInfo[`field_${i}`]"></el-input>
</template>
<template v-if="(item.fieldType === 'textarea')">
<el-input size="small" type="textarea" :placeholder="`请输入${item.fieldName}`" v-model="formInfo[`field_${i}`]"></el-input>
</template>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: ['data', 'dict'],
data () {
return {
formInfo: {}
}
}
}
</script>
<style lang="scss" scoped>
.render-form {
.render-form__title {
font-size: 15px;
font-weight: 600;
color: #333;
}
.render-form__item {
margin-bottom: 12px;
}
.left-item__item--formname {
margin: 16px 0 32px;
padding: 0 12px;
color: #333333;
font-size: 15px;
font-weight: normal;
text-align: center;
word-break: break-all;
}
.left-item__item--text {
line-height: 20px;
// margin-bottom: 48px;
padding: 0 12px 20px;
text-align: justify;
color: #666;
font-size: 14px;
word-break: break-all;
}
.left-item__item--title {
display: flex;
margin-bottom: 10px;
i {
position: relative;
top: 3px;
margin-right: 5px;
color: #E22120;
}
span {
position: relative;
top: 3px;
}
h2 {
color: #333333;
font-size: 15px;
font-weight: 600;
}
}
.left-item__item--upload {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 120px;
height: 120px;
border-radius: 6px;
border: 1px dashed #bbb;
i {
font-size: 24px;
color: #8899bb;
}
span {
margin-top: 4px;
font-size: 12px;
color: #555;
}
}
.components-item {
position: relative;
padding: 8px 0px;
& > p {
margin-bottom: 10px;
padding: 0 12px;
font-size: 14px;
white-space: break-spaces;
color: #666;
}
.left-item__item--wrapper {
padding: 0 10px;
& > img {
max-width: 300px;
}
}
.left-item__item--upload {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 120px;
height: 120px;
border-radius: 6px;
border: 1px dashed #bbb;
i {
font-size: 24px;
color: #8899bb;
}
span {
margin-top: 4px;
font-size: 12px;
color: #555;
}
}
}
}
</style>