<template>
	<view>
		<view class="consult">
			<dHeader :title="$lang.lang.complaint.complaint"></dHeader>
		</view>
		<view class="start-bar"></view>
		<view class="consult-list">
			<view class="consult-list-it" v-for="(item, index) in data" v-if="item.content" @click="toInfo(item.id)" :key="index">
				<view class="consult-list-top">
					<view class="">{{$lang.lang.complaint.name}}：{{item.contacter}}</view>
					<text>{{$lang.lang.complaint.orderNo}}：{{item.orderId}}</text>
				</view>
				<view class="times">
					<text>{{$lang.lang.complaint.title}}：{{item.title}}</text>
					<text>{{$lang.lang.complaint.type}}：{{getTypeName(item.type)}}</text>
				</view>
				<view class="times">
					<view>
						{{$lang.lang.complaint.time}}：{{$request.getLocalTime(item.createTime)}}
					</view>
					<view :class="item.status == 1 ? 'tags': item.status==2?'tags3' : 'tags2'">
						{{$lang.lang.complaint.status}}：{{getStatusName(item.status)}}
					</view>
				</view>
				<view class="times" v-if="item.status==3">
					<view>{{$lang.lang.complaint.disposeTime}}：{{$request.getLocalTime(item.handleAt)}}</view>
				</view>
			</view>
		</view>

		<view class="bom">
			<view class="" @click="$request.goPage('../complaint_add/complaint_add')">
				<image src="../../static/img/feed.png" mode=""></image>
				<text>{{$lang.lang.complaint.new}}</text>
			</view>
			<view class="" @click="$request.goPage('../consult/consult')">
				<image src="../../static/img/zixun.png" mode=""></image>
				<text>{{$lang.lang.complaint.change}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import dHeader from '../../components/dHeader/index.vue'
	export default {
		components: {
			dHeader
		},
		data() {
			return {
				data: [],
				page: 1,
				totalPage: 1,
				typeData:[],
				statusData:[]
			}
		},
		onLoad() {
			this.getType()
			this.getStatus()
		},
		onShow () {
			this.page = 1
			this.getData()
		},
		onPullDownRefresh() {
			this.page = 1
			this.data = []
			this.getData()
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			if(this.totalPage > this.page){
				this.page ++
				this.getData()
			}
		},
		methods: {
			getData () {
				this.$request.get('/app-api/ecw/customer-complaint/page', {pageNo: this.page, pageSize: 20}).then(res => {
					console.log(res)
					if(res.code == 0&&res.data){
						if(this.page == 1){
							this.data = res.data.list
						} else {
							this.data = this.data.concat(res.data.list)
						}
						this.totalPage = res.data.pages
					}
				})
			},
			toInfo(id){
				uni.navigateTo({
					url:'../complaint_info/complaint_info?id='+id
				})
			},
			getType(){
				this.$request.getConfig('customer_complaint_type').then(res => {
					if(res.code == 0&&res.data&&res.data.list.length > 0){
						this.typeData = res.data.list
					}
				})
			},
			getTypeName(value){
				var data = this.typeData.find(item=>item.value == value)
				if(data) {
          return data[this.$lang.label];
				}
			},
			getStatus(){
				this.$request.getConfig('customer_complaint_status').then(res => {
					if(res.code == 0&&res.data&&res.data.list.length > 0){
						this.statusData = res.data.list
					}
				})
			},
			getStatusName(value){
				var data = this.statusData.find(item=>item.value == value)
				if(data) {
					if(this.$lang.locale=='zh'){
						return data.label
					}else if(this.$lang.locale=='en'){
						return data.labelEn
					} else {
						return data.labelFr
					}
				}
			},
		}
	}
</script>

<style>
	@import url("../../static/css/complaint.css");
</style>