7 changed files with 338 additions and 82 deletions
@ -0,0 +1,189 @@ |
|||||
|
<template> |
||||
|
<u-navbar :title="titleData.title" placeholder="true" bg-color="#F1F3F9" :auto-back="true"></u-navbar> |
||||
|
<view class="container"> |
||||
|
<u-form labelPosition="top"> |
||||
|
<u-form-item :label="item.title" :prop="item.type" v-for="(item,index) in titleData.question" :key="index"> |
||||
|
<u-input v-model="item.answer" v-if="item.type === 'input'" /> |
||||
|
<u-textarea v-model="item.answer" v-if="item.type === 'textarea'" placeholder="请输入内容" |
||||
|
autoHeight></u-textarea> |
||||
|
<u-radio-group v-model="item.answer" v-if="item.type === 'radio'" placement="column" |
||||
|
@change="groupChange"> |
||||
|
<u-radio :customStyle="{marginBottom: '16rpx'}" v-for="(item, index) in item.choose" :key="index" |
||||
|
:label="item.name" :name="item.name"> |
||||
|
</u-radio> |
||||
|
</u-radio-group> |
||||
|
<u-checkbox-group v-model="item.answer" v-if="item.type === 'checkbox'" placement="column" |
||||
|
> |
||||
|
<u-checkbox :customStyle="{marginBottom: '16rpx'}" v-for="(item, index) in item.choose" :key="index" |
||||
|
:label="item.name" :name="item.name"> |
||||
|
</u-checkbox> |
||||
|
</u-checkbox-group> |
||||
|
</u-form-item> |
||||
|
</u-form> |
||||
|
</view> |
||||
|
<view class="baombut"> |
||||
|
<view class="buttt" @click="submit"> |
||||
|
确认提交 |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script setup> |
||||
|
import { |
||||
|
onLoad |
||||
|
} from '@dcloudio/uni-app' |
||||
|
import { |
||||
|
ref |
||||
|
} from 'vue' |
||||
|
import { |
||||
|
specialSign |
||||
|
} from '@/api/index' |
||||
|
|
||||
|
const titleData = ref({}) |
||||
|
const ztid = ref('') |
||||
|
|
||||
|
|
||||
|
function processCheckboxAnswers(arr) { |
||||
|
return arr.map(item => { |
||||
|
// 基础对象结构 |
||||
|
const result = { id: item.id }; |
||||
|
|
||||
|
// 处理answer属性 |
||||
|
if (item.type === 'checkbox' && typeof item.answer === 'object') { |
||||
|
// 将对象值转为逗号分隔的字符串（带中文引号） |
||||
|
result.answer = Object.values(item.answer) |
||||
|
.map(val => `'${val}'`) |
||||
|
.join(','); |
||||
|
} else { |
||||
|
// 非checkbox类型或answer非对象的情况 |
||||
|
result.answer = item.answer; |
||||
|
} |
||||
|
|
||||
|
return result; |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
// 提交方法 |
||||
|
function submit() { |
||||
|
let istrue = true |
||||
|
titleData.value.question.forEach((ele) => { |
||||
|
if (ele.answer === '' || !ele.answer) { |
||||
|
uni.showToast({ |
||||
|
title: '请填写选择完整', |
||||
|
duration: 3000, |
||||
|
icon:'error' |
||||
|
}) |
||||
|
istrue = false |
||||
|
} |
||||
|
}) |
||||
|
if(istrue) { |
||||
|
let param = { |
||||
|
special_list_id: ztid.value, |
||||
|
form_id: titleData.value.form_id, |
||||
|
answer: processCheckboxAnswers(titleData.value.question) |
||||
|
} |
||||
|
specialSign(param).then((res)=> { |
||||
|
if(res.code === 1) { |
||||
|
uni.showToast({ |
||||
|
title: '提交成功！', |
||||
|
duration: 2000 |
||||
|
}) |
||||
|
setTimeout(()=> { |
||||
|
uni.navigateBack() |
||||
|
},2000) |
||||
|
} else { |
||||
|
uni.showToast({ |
||||
|
title: res.msg, |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
onLoad(async (param) => { |
||||
|
ztid.value = param.id |
||||
|
titleData.value = JSON.parse(param.form) |
||||
|
}) |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.container { |
||||
|
background-color: #F1F3F9; |
||||
|
height: calc(100vh - 350rpx); |
||||
|
width: 100%; |
||||
|
padding: 0 48rpx; |
||||
|
box-sizing: border-box; |
||||
|
overflow-y: auto; |
||||
|
|
||||
|
.titlepart { |
||||
|
display: flex; |
||||
|
align-items: baseline; |
||||
|
margin-bottom: 40rpx; |
||||
|
|
||||
|
.title { |
||||
|
font-family: Source Han Sans; |
||||
|
font-weight: 550; |
||||
|
font-size: 36rpx; |
||||
|
color: #0c092a; |
||||
|
margin-left: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.text { |
||||
|
margin-top: 32rpx; |
||||
|
font-family: Source Han Sans; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 300; |
||||
|
line-height: 60rpx; |
||||
|
letter-spacing: normal; |
||||
|
color: #3d3d3d; |
||||
|
} |
||||
|
|
||||
|
.fbtime { |
||||
|
font-family: Roboto; |
||||
|
font-size: 28rpx; |
||||
|
font-weight: normal; |
||||
|
line-height: 142rpx; |
||||
|
letter-spacing: normal; |
||||
|
/* 外部/SCMP Grey/nobel */ |
||||
|
/* 样式描述：06 Small Grey txt */ |
||||
|
color: #a1a1a1; |
||||
|
} |
||||
|
|
||||
|
:deep(.u-input) { |
||||
|
background-color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
:deep(.u-form-item__body__left__content__label) { |
||||
|
white-space: nowrap; |
||||
|
font-family: Source Han Sans; |
||||
|
font-size: 28rpx; |
||||
|
color: #0C092A; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.baombut { |
||||
|
width: 100%; |
||||
|
padding: 36rpx 0; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0, 0, 0, 0.3); |
||||
|
background: #FFFFFF; |
||||
|
position: fixed; |
||||
|
bottom: 0; |
||||
|
|
||||
|
.buttt { |
||||
|
width: 574rpx; |
||||
|
height: 96rpx; |
||||
|
border-radius: 248rpx; |
||||
|
background: linear-gradient(90deg, #007FFF 0%, #99CCFF 100%); |
||||
|
font-family: Source Han Sans; |
||||
|
font-size: 36rpx; |
||||
|
color: #FFFFFF; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue