wardrobe/pages/fankui/index.vue

<template>
	<view :style="{ minHeight: sys.windowHeight + 'px' }"
		:class="[$tm.vx.state().tmVuetify.black ? 'black' : ' ']">
		<tm-menubars title="意见反馈" :shadow="0" :showback="true"></tm-menubars>
		<div class="zhuti">
			<tm-sheet class="kuang" style="padding-bottom: 70px !important;">
				<view style="width: 94%;margin:0 auto;">
					<view class="pt-20 pr-30 text-size-g dianz text-align-right">
						<image src="/static/img/59.png" mode="widthFix"></image>
						<text class="text-white text-size-m">意见建议记录</text>
					</view>
					<view class="mt-20 ml-15">
						<text class="text-white text-size-lg">*请选择反馈问题的类型</text>
					</view>
					<view class="mt-40" @click="aa(1)">
						<tm-checkbox v-model="checked1" label="使用投诉"></tm-checkbox>
						<text class="text-size-s fr mr-50 mt-20">联系客服</text>
					</view>
					<view @click="aa(2)">
						<tm-checkbox v-model="checked2" label="交易问题"></tm-checkbox>
						<text class="text-size-s fr mr-50 mt-20">联系客服</text>
					</view>
					<view @click="aa(3)">
						<tm-checkbox  v-model="checked3" label="软件使用问题"></tm-checkbox>
						<text class="text-size-s fr mr-50 mt-20">功能异常、产品建议等</text>
					</view>
					<view class="mt-20 ml-15 ">
						<text class="text-white text-size-lg">*请发表您的意见</text>
						<tm-input class="shuru mt-30" :vertical="true" :height="200" input-type="textarea" placeholder="请发表您的意见"  v-model="beizu" ></tm-input>
					</view>
				</view>
			</tm-sheet>
			<tm-button :round="24" class="sao mb-40 mt-40" block @click="tijiao">提交</tm-button>
		</div>
		<!-- 弹出层消息 -->
		<tm-message ref="toast"></tm-message>
	</view>
</template>	
<script>
import{myRequest} from '@/api/request.js'
export default {
	data() {
		return {
			checked1:false,
			checked2:false,
			checked3:false,
			beizu:''
		};
	},
	onLoad() {
		
	},
	created() {
		this.sys = uni.getSystemInfoSync();
	},
	methods: {
		tijiao(){
			var that=this;
			if( !this.checked1 && !this.checked2 && !this.checked3){
				that.$refs.toast.show({model:'warn',label:'请选择问题类型'})
				return
			}else if(this.beizu==""){
				that.$refs.toast.show({model:'warn',label:'请填写意见'})
				return
			}
			that.type=this.checked1?1:this.checked2?2:this.checked3?3:'';
			myRequest({
				url: "/api/Opinion/addProblem",
				method:'post',
				data:{type:that.type,problem:that.beizu}
			}).then(res => {
				console.log(res.data)
				if (res.data.code == 200) {
					that.$refs.toast.show({model:'success',label:res.data.msg})
					setTimeout(function(){
						uni.navigateBack();
					},2000)
				}else{
					that.$refs.toast.show({model:'error',label:res.data.msg})
				}
			})
		},
		aa(num){
			if(num==1){
				this.checked1=true;
				this.checked2=false;
				this.checked3=false;
			}else if(num==2){
				this.checked1=false;
				this.checked2=true;
				this.checked3=false;
			}else if(num==3){
				this.checked1=false;
				this.checked2=false;
				this.checked3=true;
			}
		},
	},
}
</script>

<style lang="scss">
	/deep/ .tm-menubars .body{
		background-color: #1b1b1b !important;
	}
	/deep/ .zhuti{padding: 10px 10px;}
	/deep/ .kuang{margin:0 !important;padding: 0px !important;}
	.dianz image{width: 30px;vertical-align: middle;margin-right: 10px;}
	/deep/ .tm-checkbox-boey-label{color: white !important;}
	/deep/ .border-primary-a-1{border-color: #303440;background: #303440;}
	/deep/ .shuru .grey-darken-5{
		background-color: #0d0d0d!important;
		padding: 0px !important;
	}
	.shuru{border:1px solid #303030;border-radius: 10px !important;padding:0px;background: #0D0D0D !important;}
	/deep/ .sao uni-button{background-color: #303440 !important;width: 88% !important;}
</style>