OfficeApp/subpkg/complaint/complaint.vue
2023-09-23 15:43:52 +08:00

123 lines
2.8 KiB
Vue

<template>
<view class="page">
<view class="card">
<view class="c_title">内容</view>
<u--textarea v-model="content" placeholder="请输入内容"
placeholderStyle="font-size: 22rpx;" style="font-size: 28rpx;background-color: #eee;min-height: 100px;"
autoHeight maxlength="-1"></u--textarea>
</view>
<mybtn text="确认提交" @click="modelShow=true"></mybtn>
<u-modal :show="modelShow" title="提示" content='确定提交吗' closeOnClickOverlay showCancelButton
@close="modelShow=false" @cancel="modelShow=false" @confirm="$u.throttle(submit, 1500)"></u-modal>
</view>
</template>
<script>
import { complaintFeedback } from "@/api/complaint.js"
import { Toast } from "../../libs/uniApi"
export default {
data() {
return {
content: '',
modelShow: false
}
},
onLoad() {},
onShow() {},
methods: {
async submit(){
this.modelShow = false;
await complaintFeedback({
content: this.content
})
this.$nextTick(()=>{
Toast('提交成功');
this.$u.sleep(800).then(()=>{
uni.navigateBack();
})
})
}
},
}
</script>
<style lang="scss" scoped>
.page {
padding-top: 30rpx;
.card {
margin: 0 auto;
margin-bottom: 28rpx;
width: 694rpx;
background-color: #fff;
border-radius: 26rpx;
padding: 28rpx;
.c_title {
font-size: 32rpx;
font-weight: bold;
color: #333333;
margin-bottom: 20rpx;
}
.file {
display: flex;
justify-content: left;
flex-wrap: wrap;
&_item {
flex-shrink: 0;
width: 200rpx;
height: 200rpx;
margin: 0 auto;
margin-bottom: 16rpx;
border: 2px solid #ccc;
border-radius: 10rpx;
overflow: hidden;
position: relative;
.image {
width: 100%;
height: 100%;
}
.del {
position: absolute;
height: 40rpx;
width: 40rpx;
top: 10rpx;
right: 10rpx;
}
}
&_btn {
flex-shrink: 0;
width: 200rpx;
height: 200rpx;
margin: 0 auto;
margin-bottom: 16rpx;
border: 2px solid #ccc;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
border-radius: 10rpx;
image {
width: 100rpx;
height: 100rpx;
}
}
&_empty {
flex-shrink: 0;
width: 200rpx;
height: 200rpx;
margin: 0 auto;
margin-bottom: 16rpx;
border: 2px solid transparent;
}
}
}
}
</style>