150 lines
3.2 KiB
Vue
150 lines
3.2 KiB
Vue
|
<template>
|
|||
|
|
<div class="feedback">
|
|||
|
|
<div class="suggest">
|
|||
|
|
<div flex class="title"><em v-text="'*'"/>请输入您的宝贵意见</div>
|
|||
|
|
<AiTextarea v-model="content" placeholder="请输入（200字以内）" :maxlength="200"/>
|
|||
|
|
</div>
|
|||
|
|
<div class="name">
|
|||
|
|
<div flex><em v-text="'*'"/>联系人</div>
|
|||
|
|
<input type="text" placeholder="请输入您的姓名" style="text-align: right;" v-model="name" class="inp">
|
|||
|
|
</div>
|
|||
|
|
<div class="phone">
|
|||
|
|
<div flex><em v-text="'*'"/>联系方式</div>
|
|||
|
|
<input type="number" placeholder="请输入您的联系方式" style="text-align: right;" v-model="phone" class="inp" maxlength="11">
|
|||
|
|
</div>
|
|||
|
|
<div class="photo">
|
|||
|
|
<div class="photo-title">图片 <span>（最多9张）</span></div>
|
|||
|
|
<div class="pad-120">
|
|||
|
|
<AiUploader :limit="9" multiple :def.sync="picture" placeholder="上传图片" action="/admin/file/add2"/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="height: 56px;"></div>
|
|||
|
|
<div class="btn" @click="submit">保存</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
name: 'feedback',
|
|||
|
|
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
content: '',
|
|||
|
|
picture: [],
|
|||
|
|
name: '',
|
|||
|
|
phone: ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
submit() {
|
|||
|
|
let {phone, content, picture, name} = this
|
|||
|
|
if (!content) {
|
|||
|
|
return this.$u.toast("请输入您的宝贵意见")
|
|||
|
|
}
|
|||
|
|
if (!name) {
|
|||
|
|
return this.$u.toast("请输入您的姓名")
|
|||
|
|
}
|
|||
|
|
if (!phone) {
|
|||
|
|
return this.$u.toast("请输入联系方式")
|
|||
|
|
}
|
|||
|
|
if (!/^\d{11}$/g.test(phone)) {
|
|||
|
|
return this.$u.toast("联系方式格式有误!")
|
|||
|
|
}
|
|||
|
|
this.$http.post("/oms/api/appfeedback/addOrUpdate", {
|
|||
|
|
phone,
|
|||
|
|
opinion: content,
|
|||
|
|
pictureUrl: picture?.map(e=>e.url).toString(),
|
|||
|
|
contacts: name,
|
|||
|
|
sourceHost: location.host
|
|||
|
|
}, {
|
|||
|
|
withoutToken: true
|
|||
|
|
}).then(res => {
|
|||
|
|
if (res?.code == 0) {
|
|||
|
|
this.$u.toast("保存成功!")
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack({})
|
|||
|
|
}, 1500)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
document.title = '意见反馈'
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.feedback {
|
|||
|
|
padding-bottom: 100px;
|
|||
|
|
|
|||
|
|
em {
|
|||
|
|
display: block;
|
|||
|
|
color: red;
|
|||
|
|
font-style: normal;
|
|||
|
|
height: initial;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.suggest {
|
|||
|
|
padding: 15px 30px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
background-color: #FFFFFF;
|
|||
|
|
margin-bottom: 8px;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100px;
|
|||
|
|
line-height: 100px;
|
|||
|
|
font-size: 32px;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.name,
|
|||
|
|
.phone {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
background-color: #FFFFFF;
|
|||
|
|
margin-bottom: 8px;
|
|||
|
|
padding: 0 30px;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 112px;
|
|||
|
|
line-height: 112px;
|
|||
|
|
font-size: 32px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.photo {
|
|||
|
|
background-color: #FFFFFF;
|
|||
|
|
padding: 20px 30px;
|
|||
|
|
|
|||
|
|
.photo-title {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100px;
|
|||
|
|
line-height: 80px;
|
|||
|
|
color: #333333;
|
|||
|
|
|
|||
|
|
& > span {
|
|||
|
|
color: #999999;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 112px;
|
|||
|
|
line-height: 112px;
|
|||
|
|
text-align: center;
|
|||
|
|
background-color: #1365DD;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</style>
|