<template>
  <view class="page-css">
    <u-navbar :is-back="false" title="客户订单">
      <view slot="right" style="display: flex;align-items: center;">
        <u-icon name="scan" size="60" color="#3a62d7" @click="scanCode" :is-center="true" style="padding-right: 20rpx;">
        </u-icon>
		<u-icon name="../../static/images/home/out.png" size="60"  :is-center="true" style="padding-right: 20rpx;" @click="logout">
		</u-icon>
      </view>
    </u-navbar>
	<view class="search_box">
		<view class="button_box" style="margin-right: 20rpx;">
			<u-button type="primary" :plain="true" style="width: 100%;height: 100%;" @click="addCommodity()">新增</u-button>
		</view>
		<!-- <view class="button_box">
			<u-button type="primary" :plain="true" style="width: 100%;height: 100%;" @click="showSearchOpen()">搜索</u-button>
		</view> -->
	</view>
    <view class="data_box">
	  <view class="list_box">
		  <view class="list_item" v-for="item in listData" :key="item.id">
		  	<view class="item_top">
		  		<view class="" style="margin-left: 10rpx;">
					<text>{{item.code}}</text>
				</view>
			</view>
			<view class="item_bottom">
				<view class="type">交货日期：{{item.deliveryDate}}</view>
				<view class="type">运输地址：{{item.transportationAddress }}</view>
				<view class="btn_box">
					<u-button size="mini" plain style="margin-right: 10rpx" @click="handleView(item)">查看</u-button>
					<u-button size="mini" plain type="primary" @click="handleFeedback(item)">反馈</u-button>
				</view>
			</view>
		  </view>
	  </view>
	  <u-loadmore margin-top="10" margin-bottom="40" :status="loadingState" />
    </view>
	<u-popup
	  v-model="showSearch"
	  mode="bottom"
	  border-radius="30"
	  :mask-close-able="false"
	  :closeable="true"
	  @close="closePop"
	>
	  <view class="popup-content">
		  <view class="title_box">搜索</view>
		  <view class="">
		  	<span>问题类型：</span>
			<u-radio-group
				v-model="searchForm.problemType"
				placement="row">
				<u-radio v-for="item in problemList" :key="item.dictKey"  :name="item.dictKey">{{item.dictValue}}</u-radio>
			</u-radio-group>
		  </view>
		<view class="">
			<span>处理状态：</span>
			<u-radio-group
				v-model="searchForm.handleStatus"
				placement="row">
				<u-radio v-for="item in statusList" :key="item.dictKey"  :name="item.dictKey">{{item.dictValue}}</u-radio>
			</u-radio-group>
		</view>
		<view class="" style="width: 100%;display: flex;justify-content: space-between;margin-top: 30rpx;">
			<u-button type="primary" :plain="true" style="width: 48%;" @click="submitSearchForm()">搜索</u-button>
			<u-button type="primary" :plain="true" style="width: 48%;" @click="resetSearch()">重置</u-button>
		</view>
	  </view>
	</u-popup>
	<betone-tabbar ref="tabbarRef" />
  </view>
</template>
<script>
export default{
	data (){
		return{
			showSearch:false,
			tabList: [
				{name: '全部',}, 
				{name: '未处理',}, 
				{name: '处理中',}, 
				{name: '已处理',}, 
			],
			searchForm:{},
			current:0,
			listData:[],
			isNomore:false,
			userInfo:{},
			page:{
				currentPage:1,
				pageSize:10,
			},
			loadingState: "loadmore",
			goodsDetail:{},
			problemList:[],
			statusList:[],
			isSearch:false
		}
	},
	onReachBottom() {
	    if (this.isNomore) {
	        return;
	    }
	    this.page.currentPage++;
	    this.getDataList();
	},
	onPullDownRefresh() {
	    this.isNomore = false
	    this.page.currentPage = 1;
	    this.getDataList();
	    uni.stopPullDownRefresh();
	},
	onShow(){
		this.$nextTick(() =>{
			 this.$refs.tabbarRef.getPermission();
			 this.userInfo = uni.getStorageSync("userinfo")
			 this.getProblemList()
			 this.getStatusList()
			 this.getDataList()
		})
	},
	computed:{
		getStatusText(val){
			return(val =>{
				if(val && val != ''){
					return this.statusList.find(item => item.dictKey == val) ? this.statusList.find(item => item.dictKey == val).dictValue : ''
				}else{
					return ''
				}
			})
		},
		getProblemTypeText(val){
			return(val =>{
				if(val){
					return this.problemList.find(item => item.dictKey == val) ? this.problemList.find(item => item.dictKey == val).dictValue : ''
				}
			})
		},
		getProblemText(type,val){
			return(type,val) =>{
				if(val && type){
					let tmp = this.problemList.find(item => item.dictKey == type)
					if(tmp){
						let tmp1 = tmp.children && tmp.children.find(item1 => item1.dictKey == val)
						return tmp1 ? tmp1.dictValue : ''
					}
				}
			}
		}
	},
	mounted(){
		// this.userInfo = uni.getStorageSync("userinfo")
		// this.getProblemList()
		// this.getStatusList()
		// this.getDataList()
	},
	methods:{
		// 获取问题类型
		getProblemList(){
			this.$u.api.getProblemType().then(res =>{
				console.log('problem----------------',res)
				this.problemList = res.data
			}).catch(err =>{
				
			})
		},
		// 获取处理状态
		getStatusList(){
			this.$u.api.getHandleStatus().then(res =>{
				console.log('status----------------',res)
				this.statusList = res.data
			}).catch(err =>{
				
			})
		},
		// 跳转至反馈页面
		showFeedback(){
			uni.navigateTo({
			  url: "/pages/feedback/feedback",
			});
		},
		//跳转至商品新增页面
		addCommodity(){
			uni.navigateTo({
				url:'/pages/commodity/addOrder'
			})
		},
		// 查看订单详情
		handleView(item){
			console.log('item--------------------',item)
			uni.navigateTo({
				url:'/pages/commodity/orderDetail?id=' + item.id
			})
		},
		// 跳转反馈页面
		handleFeedback(item){
			uni.navigateTo({
				url:'/pages/feedback/feedback?soId=' + item.id + '&soCode=' + item.code
			})
		},
		showSearchOpen(){
			this.showSearch = true
		},
		closePop(){
			if(!this.isSearch) this.searchForm = {}
		},
		resetSearch(){
			this.searchForm = {}
			this.isSearch = false
			this.page.currentPage = 1
			this.getDataList()
		},
		submitSearchForm(){
			this.isSearch = true
			this.page.currentPage = 1
			this.getDataList()
		},
		getDataList(){
			this.loadingState = "loading";
			// this.listData = [
			// 	 {
			// 	                "id": "1961610977503227905",
			// 	                "createTime": "2025-08-30 10:04:37",
			// 	                "code": "COI020250830100433",   
			// 	                "deliveryDate": "2025-07-17",        
			// 	                "transportationAddress": "山东省青岛市崂山区国际创新园", 
			// 	            }
			// ]
			
			 this.$u.api
			   .getOrderList({
			 	  current:this.page.currentPage,
			 	  size:this.page.pageSize,
			 	  userId:this.userInfo.user_id,
			   })
			   .then((res) => {
			 	  if(res.code == 200){
					  console.log('res---------------------------------------------------------',res)
			 		  var totalPage = res.data.total;
			 		  var newOrders = res.data.records;
			 		  if (this.page.currentPage == 1) {
					      this.listData = [];
			 		  }
			 		  this.listData = [...this.listData, ...(res.data.records || [])];
			 		  if (newOrders.length == 0) {
			 		      this.loadingState = "nomore";
			 		      this.isNomore = true;
			 		  }
			 		  if (totalPage == this.listData.length) {
					      this.loadingState = "nomore";
			 		      this.isNomore = true;
					  }
					  this.showSearch = false
			 	  }
			   }).catch(err =>{
			 	  console.log('err--------------',err)
			   })
		},
		
		// 获取详情
		getDetail(val){
			this.$u.api
			  .getGoodsDetail({
				id:val
			}).then(res =>{
				console.log('res1----------------------',res) 
				this.goodsDetail = res.data
				uni.navigateTo({
				  url: "/pages/feedback/feedback?id=" + this.goodsDetail.id + '&name=' + this.goodsDetail.name,
				});
			}).catch(err =>{
				  
			})
			
		},
		// handleAdd(){
		// 	this.$u.api.addQuality().then(res =>{
				
		// 	}).catch(err =>{
				
		// 	})
		// },
		// 扫一扫 方法
		scanCode(){
		  uni.scanCode({
		    success: (res) => {
		      console.log('扫码结果：' + res.result);
			  // this.getDetail(res.result)
			  // uni.navigateTo({
			  //   url: res.result,
			  // });
			  uni.navigateTo({
			    url: "/pages/feedback/feedback?soCode=" + res.result,
			  });
		    },
		    fail: (err) => {
		      console.error('扫码失败：' + err);
		    }
		  });
		},
		
		// 退出
		logout() {
		  uni.showModal({
		    title: "提示：",
		    content: "请确认是否要退出登录?",
		    success: (res) => {
		      if (res.confirm) {
		        this.$u.api.logout().then(res => {
					console.log('outres----------------',res)
		          //TODO
		          uni.removeStorageSync("token");
		          uni.removeStorageSync("userinfo");
		          uni.removeStorageSync("tabBarList");
		          uni.redirectTo({
		            url: "/pages/login/login",
		          });
		        })
		
		
		      } else if (res.cancel) {
		        //TODO
		      }
		    },
		  });
		},
		
		// clickTabs(item){
		// 	console.log('item===============',item)
		// 	this.current = item
		// }
	}
}
</script>
<style lang="scss" scoped>
.page-css {
  width: 100%;
  padding: 0;
  background: rgba(239, 239, 239, 1);
  
  .search_box{
	  width: 95%;
	  height: 60rpx;
	  margin: 0 auto;
	  margin-top: 20rpx;
	  display: flex;
	  justify-content: flex-end;
	  
	  .button_box{
		  width: 20%;
		  height: 60rpx;
		  float: right;
	  }
  }
  
  .data_box{
	  .list_box{
		  width: 95%;
		  margin: 0 auto;
		  margin-top: 20rpx;
		  
		  .list_item{
			  padding: 20rpx;
			  width: 100%;
			  background: #fff;
			  border-radius: 10rpx;
			  margin-bottom: 20rpx;
			  
			  .item_top{
				  width: 100%;
				  height: 75rpx;
				  border-bottom: 1px solid rgba(239, 239, 239, 1);
				  display: flex;
				  align-items: center;
				  justify-content: space-between;
				  
				  .feedBtn{
					  
				  }
			  }
			  .item_bottom{
				  .type{
					  margin:10rpx 10rpx 0 10rpx;
				  }
				  
				  .btn_box{
					  text-align: right;
					  margin-right: 10rpx;
					  margin-top: 10rpx;
					  // display: flex;
					  // justify-content: flex-end;
				  }
			  }
		  }
	  }
  }
  .popup-content {
    position: relative;
    background: #fff;
    box-shadow: 0px, -2px rgba(0, 0, 0, 0.25);
    padding: 32rpx;
    position: relative;
    min-height: 320rpx;
	
	.title_box{
		font-size: 18px;
		width: 100%;
		text-align: center;
		margin-bottom: 20rpx;
	}
  }
}
</style>