<template>
	<view class="page">
		
		<view class="back"></view>
		<view class="wrapnob">
			<!-- 主体内容 -->
			<scroll-view class="main-content" scroll-y="true">
			  <view class="department-list">
				
				<!-- 部门+工场 -->
				<view class="department-item" v-for="(item, index1) in list" :key="'dp1_'+index1">
					
				  <view class="department-header" @click="toggle1(index1)">
				    <view class="header-info">
				      <uni-icons :type="item.expanded ? 'arrowdown' : 'arrowright'" size="14" color="#999"></uni-icons>
				      <text class="dept-name">{{retType(item.departCode,2)}}+{{item.workshop}}</text>
				      <text class="dept-count">(共{{item.total}}个托盘)</text>
				    </view>
				  </view>
				  
				  <view v-if="item.expanded" class="region-list">
					
					<!-- 托盘明细 -->
					<!-- <view v-for="pallet in item.deliveryList" :key="pallet.palletNo" class="pallet-items" @click="openPalletDetail(pallet)">
					  <view class="pallet-info">
					    <text class="pallet-id">{{ pallet.palletNo }}</text>
					    <text class="pallet-status" :class="getStatusClass(pallet.status)">
					      {{ retType(pallet.status,1) }}
					    </text> 
					  </view>
					  <uni-icons type="forward" size="14" color="#ccc"></uni-icons>
					</view> -->
					
				    <!-- 区域 -->
				    <view class="region-item" v-for="(cell, index2) in item.children" :key="'dp2_'+index2">
					  
				      <view class="region-header" @click="toggle2(index1,index2)">
				        <view class="header-info">
				          <uni-icons :type="cell.expanded ? 'arrowdown' : 'arrowright'" size="14" color="#999"></uni-icons>
				          <text class="region-name">{{cell.location}}</text>
				          <text class="region-count">(共{{getSend(index1,index2)?cell.total:0}}个托盘)</text>
				        </view>
				      </view>
				      
				      <view v-if="cell.expanded" class="address-list">
						  
						<!-- 托盘明细 -->
						<view v-if="cell.deliveryList" v-for="pallet in cell.deliveryList" :key="pallet.palletNo" class="pallet-items" @click="openPalletDetail(pallet)">
						  <view class="pallet-info">
						    <text class="pallet-id">{{ pallet.palletNo }}</text>
						    <text class="pallet-status" :class="getStatusClass(pallet.status)">
						      {{ retType(pallet.status,1) }}
						    </text> 
							<text class="pallet-num">存放天数({{pallet.stayDays?pallet.stayDays:0}})</text>
						  </view>
						  <uni-icons type="forward" size="14" color="#ccc"></uni-icons>
						</view>
						
				        <!-- 地址 -->
						<view class="address-item" v-for="(element,index3) in cell.children" :key="'dp3_'+index3">
							
				          <view class="address-header" @click="toggle3(index1,index2,index3)">
				            <view class="header-info">
				              <uni-icons :type="element.expanded ? 'arrowdown' : 'arrowright'" size="14" color="#999"></uni-icons>
				              <text class="address-name">{{element.address}}</text>
				              <text class="address-count">(共{{getThird(index1,index2,index3)?element.total:0}}个托盘)</text>
				            </view>
				          </view>
						  
				          <view v-if="element.expanded" class="pallet-list">
							  
							<!-- 托盘明细 -->
				            <view v-for="pallet in element.pallets" :key="pallet.palletNo" class="pallet-item" @click="openPalletDetail(pallet)">
				              <view class="pallet-info">
				                <text class="pallet-id">{{ pallet.palletNo }}</text>
				                <text class="pallet-status" :class="getStatusClass(pallet.status)">
				                  {{ retType(pallet.status,1) }}
				                </text>
								<text class="pallet-num">存放天数({{pallet.stayDays?pallet.stayDays:0}})</text>
				              </view>
				              <uni-icons type="forward" size="14" color="#ccc"></uni-icons>
				            </view>
							
				          </view>
						  
				        </view>
						
						
					  </view>
					  
				    </view>

				  </view>
				  
				</view>
				
				
			  </view>
			  
			</scroll-view>
		</view>
		
		<!-- 底部详情弹窗 -->
		<view v-if="showDetailModal" class="modal-overlay" @click="closeDetailModal">
		  <view class="detail-modal">
			  
		    <view class="modal-header">
		      <text class="modal-title">托盘详情</text>
		      <uni-icons
		        type="closeempty"
		        size="20"
		        color="#999"
		        @click="closeDetailModal"
		      ></uni-icons>
		    </view>
		    
			<view class="modal-content">
				
				<view class="detail-row">
				  <text class="label">编号：</text>
				  <text class="value">{{ currentPallet.id }}</text>
				</view>
				<view class="detail-row">
				  <text class="label">当前状态：</text>
				  <text class="value" :class="getStatusClass(currentPallet.status)">
				    {{ getStatusText(currentPallet.status) }}
				  </text>
				</view>
				<view class="detail-row">
				  <text class="label">所属部门：</text>
				  <text class="value">{{ currentPallet.department }}</text>
				</view>
				<view class="detail-row">
				  <text class="label">所在区域：</text>
				  <text class="value">{{ currentPallet.region }}</text>
				</view>
				<view class="detail-row">
				  <text class="label">具体地址：</text>
				  <text class="value">{{ currentPallet.address }}</text>
				</view>
				<view class="detail-row">
				  <text class="label">最后更新：</text>
				  <text class="value">{{ currentPallet.lastUpdate }}</text>
				</view>
				
		    </view>
			
		  </view>
		</view>
		
		<u-toast ref="uToast" />
		
		<!-- 配送单详情 -->
		<u-popup v-model="show"  @close="close" mode="center" :mask="true" :closeable="true" :border-radius="20" close-icon-pos="top-right">
			<view class="ppcon">
				<psDetail :palletAll="palletAll"></psDetail>
			</view>
		</u-popup>

	</view>
	
</template>

<script>
	import psDetail from "@/components/psDetail.vue";
	export default {
		components: {
		  psDetail
		},
		data() {
			return {
				show:false,
				list:[],
				page: {
					addressCode:"",
					departCode:"",
					workshop:"",
					location:"",
					address:"", 
				},
				address:[],
				users:[],
				depts:[],
				dicts:[],
				gcs:[],
				status:[],
				palletStatus:[],
				palletAll:null,
				
				// 展开状态部门
				expandedDepartments: {
				  dept1: true,
				  dept2: true,
				},
				// 展开状态区域
				expandedRegions: {
				  'dept1-region1': true,
				  'dept1-region2': false,
				  'dept2-region1': true,
				  'dept2-region2': false,
				},
				// 展开状态地址
				expandedAddresses: {
				  'dept1-region1-addr1': true,
				  'dept1-region1-addr2': false,
				  'dept1-region2-addr1': false,
				  'dept1-region2-addr2': false,
				  'dept2-region1-addr1': true,
				  'dept2-region1-addr2': false,
				  'dept2-region2-addr1': false,
				},
				// 托盘数据
				palletsData: {
				  dept1: {
				    region1: {
				      addr1: [
				        { id: 'TPL-001', status: 'in-use', department: '生产一部', region: '装配区', address: 'A区生产线', lastUpdate: '2023-10-15 14:30' },
				        { id: 'TPL-002', status: 'idle', department: '生产一部', region: '装配区', address: 'A区生产线', lastUpdate: '2023-10-15 15:20' },
				        { id: 'TPL-003', status: 'maintenance', department: '生产一部', region: '装配区', address: 'A区生产线', lastUpdate: '2023-10-15 16:10' },
				      ],
				      addr2: [
				        { id: 'TPL-004', status: 'in-use', department: '生产一部', region: '装配区', address: 'B区仓库', lastUpdate: '2023-10-15 13:45' },
				        { id: 'TPL-005', status: 'idle', department: '生产一部', region: '装配区', address: 'B区仓库', lastUpdate: '2023-10-15 12:30' },
				      ],
				    },
				    region2: {
				      addr1: [
				        { id: 'TPL-006', status: 'in-use', department: '生产一部', region: '包装区', address: 'C区包装线', lastUpdate: '2023-10-15 11:20' },
				        { id: 'TPL-007', status: 'idle', department: '生产一部', region: '包装区', address: 'C区包装线', lastUpdate: '2023-10-15 10:15' },
				        { id: 'TPL-008', status: 'in-use', department: '生产一部', region: '包装区', address: 'C区包装线', lastUpdate: '2023-10-15 09:45' },
				        { id: 'TPL-009', status: 'idle', department: '生产一部', region: '包装区', address: 'C区包装线', lastUpdate: '2023-10-15 08:30' },
				      ],
				      addr2: [
				        { id: 'TPL-010', status: 'in-use', department: '生产一部', region: '包装区', address: 'D区成品库', lastUpdate: '2023-10-15 14:10' },
				        { id: 'TPL-011', status: 'idle', department: '生产一部', region: '包装区', address: 'D区成品库', lastUpdate: '2023-10-15 13:25' },
				        { id: 'TPL-012', status: 'maintenance', department: '生产一部', region: '包装区', address: 'D区成品库', lastUpdate: '2023-10-15 12:40' },
				      ],
				    },
				  },
				  dept2: {
				    region1: {
				      addr1: [
				        { id: 'TPL-013', status: 'in-use', department: '物流二部', region: '仓储区', address: 'E区原料仓', lastUpdate: '2023-10-15 15:00' },
				        { id: 'TPL-014', status: 'idle', department: '物流二部', region: '仓储区', address: 'E区原料仓', lastUpdate: '2023-10-15 14:15' },
				        { id: 'TPL-015', status: 'in-use', department: '物流二部', region: '仓储区', address: 'E区原料仓', lastUpdate: '2023-10-15 13:30' },
				      ],
				      addr2: [
				        { id: 'TPL-016', status: 'idle', department: '物流二部', region: '仓储区', address: 'F区成品仓', lastUpdate: '2023-10-15 12:45' },
				        { id: 'TPL-017', status: 'in-use', department: '物流二部', region: '仓储区', address: 'F区成品仓', lastUpdate: '2023-10-15 11:50' },
				      ],
				    },
				    region2: {
				      addr1: [
				        { id: 'TPL-018', status: 'in-use', department: '物流二部', region: '配送区', address: 'G区配送站', lastUpdate: '2023-10-15 10:30' },
				        { id: 'TPL-019', status: 'idle', department: '物流二部', region: '配送区', address: 'G区配送站', lastUpdate: '2023-10-15 09:45' },
				        { id: 'TPL-020', status: 'in-use', department: '物流二部', region: '配送区', address: 'G区配送站', lastUpdate: '2023-10-15 08:50' },
				      ],
				    },
				  },
				},
				
				// 详情打开
				showDetailModal: false,
				currentPallet: null,

			};
		},
		onLoad(option) {
			// 获取列表数据
			this.getList();
			// 先加载分类
			this.getTypes();
			
			// this.handleSearch();
		},
		onShow(){},
		methods: {
			close() {
				this.show = false;
			},
			open() {
				this.show = true;
			},
			
			getTypes() {
				//获取数据字典
				this.gcs=[];
				this.status=[];
				var commondata = uni.getStorageSync("commondata");
				if(commondata){
					var data = JSON.parse(commondata);
					if(data){
						this.users=data.users;
						this.dicts=data.dicts;
						this.depts=data.depts;
						this.address=data.address;
						this.dicts.forEach(cell=>{
							if("PJCD"==cell.bmlb&&cell.zfbz!=='1'){
								// 工程
								this.gcs.push(cell);
							}
							if("TPZT"==cell.bmlb){
								// 托盘转运状态
								this.status.push(cell);
							}
							// if("SYZT"==cell.bmlb){
							// 	// 托盘转运状态
							// 	this.palletStatus.push(cell);
							// }
							// console.log(cell.bmlb)
						});
						console.log(this.status);
						this.$forceUpdate();
					}
				}
				else{
					this.users=[];
					this.dicts=[];
					this.depts=[];
					this.address=[];
				}
			},
			retType(type,str) {
				var rets = '';
				if(str==1){
					// 状态
					this.status.forEach((cell,idx)=>{
						if(type==cell.bm){
							rets=cell.bmsm;
							return;
						}
					});
				}
				else if(str==2){
					// 部门
					this.depts.forEach((cell,idx)=>{
						if(type==cell.departCode){
							rets=cell.departName;
							return;
						}
					});
				}
				else if(str==3){
					// 使用状态
					this.palletStatus.forEach((cell,idx)=>{
						if(type==cell.bm){
							rets=cell.bmsm;
							return;
						}
					});
				}
				
				if(!rets){
					rets=type
				}
				return rets;
			},
			async getList() {
				uni.showLoading({
					title: '数据加载中...'
				}); 
				const {data: res} = await uni.$http.get('/getPalletLocation',{});
				if(res.success){ 
					if(res.data&&res.data.length>0){
						// 初始化一级
						res.data.forEach((cell,index)=>{
							// var children=[];
							// console.log(this.address)
							// this.address.forEach((adr,ii)=>{
							// 	// 初始化二级
							// 	if(cell.departCode==adr.departCode&&cell.workshop==adr.workshop){
									
							// 		var second={
							// 			departCode: cell.departCode,
							// 			workshop: cell.workshop,
							// 			location:adr.location,
							// 			total: null,
							// 			expanded: false,
							// 			ifload: false,// 是否加载数量
							// 			children:[]
							// 		}
							// 		children.push(second)
							// 	}
							// });
							this.list.push({
								departCode: cell.departCode,
								workshop: cell.workshop,
								total: cell.total,
								deliveryList: cell.deliveryList,
								expanded: false,
								ifload: false,
								children: []
							});
							this.$forceUpdate();
						});
					}
					console.log(this.list)
				}
			},
			async getFirst(one) {
				if(this.list[one].ifload){
					// 已经加载过了
					return true;
				}
				else{
					// 未加载
					// 转运加载 
					if(this.list[one].deliveryList&&this.list[one].deliveryList.length>0){ 
						this.list[one].children.push({
							departCode: this.list[one].departCode,
							workshop: this.list[one].workshop,
							location: "转运",
							total: this.list[one].deliveryList.length,
							expanded: false,
							ifload: true,// 是否加载数量
							deliveryList: this.list[one].deliveryList,
							children: []
						});
					}
					
					this.list[one].ifload=true;
					this.$forceUpdate();
					// 加载二级区域列表数量
					uni.showLoading({
						title: '数据加载中...'
					});
					const {data: res} = await uni.$http.get('/getPalletLocation',{
						departCode: this.list[one].departCode,
						workshop: this.list[one].workshop
					});
					if(res.success){ 
						if(res.data&&res.data.length>0){
							res.data.forEach(ii=>{
								var second={
									departCode: this.list[one].departCode,
									workshop: this.list[one].workshop,
									location:ii.location,
									total: ii.total,
									expanded: false,
									ifload: false,// 是否加载数量
									children:[]
								}
								this.list[one].children.push(second);
								this.$forceUpdate();
							})
							this.list[one].expanded=!this.list[one].expanded;
							this.$forceUpdate(); 
							console.log(this.list[one]);
							return true;
						}
						else{
							this.list[one].total=0;
							this.list[one].children=[];
							this.$forceUpdate();
							this.list[one].expanded=!this.list[one].expanded;
							this.$forceUpdate();
							return 0;
						}
					}
					else{
						this.list[one].total=0;
						this.list[one].children=[];
						this.$forceUpdate();
						this.list[one].expanded=!this.list[one].expanded;
						this.$forceUpdate();
						return 0;
					}
				}
			},
			async getSend(one,two) { 
				if(this.list[one].children[two].ifload){
					// 已经加载过了
					return true;
				}
				else{
					// 未加载
					this.list[one].children[two].ifload=true;
					this.$forceUpdate();
					// 加载二级区域列表数量
					uni.showLoading({
						title: '数据加载中...'
					});
					const {data: res} = await uni.$http.get('/getPalletLocation',{
						departCode: this.list[one].departCode,
						workshop: this.list[one].workshop,
						location: this.list[one].children[two].location
					});
					if(res.success){ 
						if(res.data&&res.data.length>0){
							var total=0;
							res.data.forEach(ii=>{
								if(ii.location==this.list[one].children[two].location){
									total=ii.total
								}
							})
							this.list[one].children[two].total=total;
							this.$forceUpdate();
							var children = [];
							this.address.forEach((adr,ii)=>{
								// 初始化三级
								if(this.list[one].departCode==adr.departCode&&this.list[one].workshop==adr.workshop&&this.list[one].children[two].location==adr.location){
									var third={
										departCode: adr.departCode,
										workshop: adr.workshop,
										location:adr.location,
										address:adr.address,
										total: null,
										expanded: false,
										ifload: false,// 是否加载数量
										pallets:[]
									}
									children.push(third)
								}
							});
							this.list[one].children[two].children=children;
							this.$forceUpdate();
							return true;
						}
						else{
							this.list[one].children[two].total=0;
							this.list[one].children[two].children=[];
							this.$forceUpdate();
							return 0;
						}
					}
					else{
						this.list[one].children[two].total=0;
						this.list[one].children[two].children=[];
						this.$forceUpdate();
						return 0;
					}
				}
			},
			async getThird(one,two,third) {
				if(this.list[one].children[two].children[third].ifload){
					// 已经加载过了
					return true;
				}
				else{
					// 未加载
					this.list[one].children[two].children[third].ifload=true;
					// 加载三级地址列表数量
					uni.showLoading({
						title: '数据加载中...'
					}); 
					const {data: res} = await uni.$http.get('/getPalletLocation',{
						departCode: this.list[one].departCode,
						workshop: this.list[one].workshop,
						location: this.list[one].children[two].location,
						address: this.list[one].children[two].children[third].address,
					});
					if(res.success){ 
						if(res.data&&res.data.length>0){
							var total=0;
							var pallets=[];
							res.data.forEach(ii=>{
								if(ii.address==this.list[one].children[two].children[third].address){
									total=ii.total
									pallets=ii.pallets
								}
							})
							this.list[one].children[two].children[third].total=total;
							this.list[one].children[two].children[third].pallets=pallets;
							this.$forceUpdate();
							return true;
						}
						else{
							this.list[one].children[two].children[third].total=0;
							this.list[one].children[two].children[third].pallets=[];
							this.$forceUpdate();
							return 0;
						}
					}
					else{
						this.list[one].children[two].children[third].total=0;
						this.list[one].children[two].children[third].pallets=[];
						this.$forceUpdate();
						return 0;
					}
				}
			},
			toggle1(one){
				if(this.list[one].ifload){
					this.list[one].expanded=!this.list[one].expanded;
					this.$forceUpdate();
				}
				else{
					this.getFirst(one);
				}
			},
			toggle2(one,two){
				this.list[one].children[two].expanded=!this.list[one].children[two].expanded;
				this.$forceUpdate();
			},
			toggle3(one,two,third){
				this.list[one].children[two].children[third].expanded=!this.list[one].children[two].children[third].expanded;
				this.$forceUpdate();
			},
			// 显示托盘详情
			async openPalletDetail(pallet) {
				if(pallet.palletNo){
					uni.showLoading({
						title: '数据加载中...'
					});
					const {data: res} = await uni.$http.get('/getPalletAll',{
						code: pallet.palletNo,
						type: '20'
					});
					if(res.success){ 
						if(res.data)
						{
							this.palletAll=res.data;
							this.$forceUpdate();
							// 打开托盘详情弹框
							this.open();
						}
					}
					else{
						this.$refs.uToast.show({
						  title: "暂无托盘详情信息！",
						  type: "warning",
						  duration: 3000,
						});
					}
				}
				else{
					this.$refs.uToast.show({
					  title: "托盘详情查询失败！",
					  type: "warning",
					  duration: 3000,
					});
				}
			},
			// 处理搜索
			handleSearch() {
			  if (!this.searchKeyword) {
			    this.searchResults = [];
			    return;
			  }
			  // 模拟搜索逻辑
			  const allPallets = [
			    ...palletsData.dept1.region1.addr1,
			    ...palletsData.dept1.region1.addr2,
			    ...palletsData.dept1.region2.addr1,
			    ...palletsData.dept1.region2.addr2,
			    ...palletsData.dept2.region1.addr1,
			    ...palletsData.dept2.region1.addr2,
			    ...palletsData.dept2.region2.addr1,
			  ];
			
			  this.searchResults = allPallets.filter(pallet =>
			    pallet.id.toLowerCase().includes(this.searchKeyword.toLowerCase())
			  );
			},
			// 切换部门展开状态
			toggleDepartment(deptId) {
			  this.expandedDepartments[deptId] = !this.expandedDepartments[deptId];
			},
			// 切换区域展开状态
			toggleRegion(regionId) {
			  this.expandedRegions[regionId] = !this.expandedRegions[regionId];
			},
			// 切换地址展开状态
			toggleAddress(addrId) {
			  this.expandedAddresses[addrId] = !this.expandedAddresses[addrId];
			},
			// 获取状态文本
			getStatusText(status) {
			  switch (status) {
			    case 'in-use':
			      return '使用中';
			    case 'idle':
			      return '空闲';
			    case 'maintenance':
			      return '维修中';
			    default:
			      return '未知';
			  }
			},
			// 获取状态样式类
			getStatusClass(status) {
			  switch (status) {
			    case '01':
			      return 'status-01';
			    case '02':
			      return 'status-02';
			    case '03':
			      return 'status-03';
				case '04':
				  return 'status-04';
				case '05':
				  return 'status-05';
				case '06':
				  return 'status-06';
			    default:
			      return 'status-01';
			  }
			},
			// 显示托盘详情
			showPalletDetail(pallet) {
			  this.currentPallet = pallet;
			  this.showDetailModal = true;
			},
			// 关闭详情弹窗
			closeDetailModal(){
			  this.showDetailModal = false;
			  this.currentPallet = null;
			},
		}
		
	}
</script>

<style lang="scss" scoped>
	.ppcon{
		width: calc(100vw - 60rpx);
		height: calc(100vh - 100rpx) !important;
		/* #ifdef H5 */
		height: calc(100vh - var(--window-top) - 100rpx) !important;
		/* #endif */
		overflow-y: auto;
	}
	.wrapnob{
		overflow-y: auto;
	}
	.container {
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	  background-color: #f5f5f5;
	}
	
	.search-container {
	  padding: 20rpx 30rpx;
	  background-color: #fff;
	  border-bottom: 1rpx solid #eee;
	}
	
	.search-wrapper {
	  display: flex;
	  align-items: center;
	  background-color: #f8f8f8;
	  border-radius: 30rpx;
	  padding: 10rpx 20rpx;
	}
	
	.search-input {
	  flex: 1;
	  padding: 10rpx 15rpx;
	  font-size: 28rpx;
	}
	
	.search-btn {
	  width: 60rpx;
	  height: 60rpx;
	  background-color: #007aff;
	  border-radius: 50%;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  margin-left: 10rpx;
	}
	
	.filter-container {
	  display: flex;
	  padding: 20rpx 30rpx;
	  background-color: #fff;
	  border-bottom: 1rpx solid #eee;
	}
	
	.filter-item {
	  padding: 10rpx 20rpx;
	  font-size: 26rpx;
	  color: #666;
	  border-radius: 30rpx;
	  margin-right: 20rpx;
	  background-color: #f8f8f8;
	}
	
	.filter-item.active {
	  background-color: #007aff;
	  color: #fff;
	}
	
	.main-content {
	  flex: 1;
	  overflow: auto;
	  padding: 20rpx 0;
	}
	
	.department-list {
	  padding: 0 30rpx;
	}
	
	.department-item {
	  background-color: #fff;
	  border-radius: 12rpx;
	  margin-bottom: 20rpx;
	  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}
	
	.department-header {
	  padding: 30rpx;
	  display: flex;
	  align-items: center;
	  border-bottom: 1rpx solid #eee;
	}
	
	.header-info {
	  display: flex;
	  align-items: center;
	}
	
	.dept-name {
	  font-size: 30rpx;
	  font-weight: 500;
	  color: #333;
	  margin: 0 15rpx;
	}
	
	.dept-count {
	  font-size: 26rpx;
	  color: #999;
	}
	
	.region-list {
	  padding-left: 30rpx;
	}
	
	.region-item {
	  border-radius: 12rpx;
	  margin-bottom: 10rpx;
	  background-color: #fafafa;
	}
	
	.region-header {
	  padding: 25rpx 30rpx;
	  display: flex;
	  align-items: center;
	  border-bottom: 1rpx solid #eee;
	}
	
	.region-name {
	  font-size: 28rpx;
	  font-weight: 500;
	  color: #333;
	  margin: 0 15rpx;
	}
	
	.region-count {
	  font-size: 24rpx;
	  color: #999;
	}
	
	.address-list {
	  padding-left: 30rpx;
	}
	
	.address-item {
	  border-radius: 12rpx;
	  margin-bottom: 10rpx;
	  background-color: #fff;
	}
	
	.address-header {
	  padding: 20rpx 30rpx;
	  display: flex;
	  align-items: center;
	  border-bottom: 1rpx solid #eee;
	}
	
	.address-name {
	  font-size: 26rpx;
	  color: #333;
	  margin: 0 15rpx;
	}
	
	.address-count {
	  font-size: 24rpx;
	  color: #999;
	}
	
	.pallet-list {
	  padding: 0 30rpx 20rpx 60rpx;
	}
	
	.pallet-items {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  padding: 20rpx 10rpx 30rpx 40rpx;
	  border-bottom: 1rpx solid #f0f0f0;
	}
	
	.pallet-items:last-child {
	  border-bottom: none;
	}
	
	.pallet-item {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  padding: 20rpx 0;
	  border-bottom: 1rpx solid #f0f0f0;
	}
	
	.pallet-item:last-child {
	  border-bottom: none;
	}
	
	.pallet-info {
	  display: flex;
	  align-items: center;
	  width: 100%;
	}
	
	.pallet-id {
	  font-size: 28rpx;
	  color: #333;
	  margin-right: 20rpx;
	}
	
	.pallet-status {
	  font-size: 24rpx;
	  padding: 4rpx 12rpx;
	  border-radius: 12rpx;
	}
	
	.pallet-num {
		font-size: 24rpx;
		color: #999;
		display: flex;
		flex: 1;
		justify-content: flex-end;
		margin-right: 10rpx;
		width: 100%;
	}
	
	.status-01 {
	  color: #86909c;
	  background-color: #f7f8fa;
	  border: 1rpx solid #c9cdd4;
	}
	
	.status-02 {
	  color: #00a8ff;
	  background-color: #e6f7ff;
	  border: 1rpx solid #91d5ff;
	}
	
	.status-03 {
	  color: #faad14;
	  background-color: #fffbe6;
	  border: 1rpx solid #ffe58f;
	}
	
	.status-04 {
	  color: #8e4dba;
	  background-color: #f5ebff;
	  border: 1rpx solid #c396ed;
	} 
	
	.status-05 {
	  color: #16c89e;
	  background-color: #e8fff6;
	  border: 1rpx solid #39d3aa;
	}
	
	.status-06 {
	  color: #fadc19;
	  background-color: #feffeb;
	  border: 1rpx solid #fbe842;
	}
	
	.search-results {
	  padding: 0 30rpx;
	  margin-top: 20rpx;
	}
	
	.result-title {
	  font-size: 30rpx;
	  font-weight: 500;
	  color: #333;
	  margin-bottom: 20rpx;
	}
	
	.modal-overlay {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background-color: rgba(0, 0, 0, 0.5);
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  z-index: 1000;
	}
	
	.detail-modal {
	  width: 90%;
	  height: calc(100vh - 100rpx) !important;
	  /* #ifdef H5 */
	  height: calc(100vh - var(--window-top) - 100rpx) !important;
	  /* #endif */
	  background-color: #fff;
	  border-radius: 16rpx;
	  overflow-y: auto;
	}
	
	.modal-header {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  padding: 30rpx;
	  border-bottom: 1rpx solid #eee;
	}
	
	.modal-title {
	  font-size: 32rpx;
	  font-weight: 500;
	  color: #333;
	}
	
	.modal-content {
	  padding: 30rpx;
	}
	
	.detail-row {
	  display: flex;
	  margin-bottom: 20rpx;
	}
	
	.detail-row:last-child {
	  margin-bottom: 0;
	}
	
	.label {
	  font-size: 28rpx;
	  color: #666;
	  width: 160rpx;
	}
	
	.value {
	  font-size: 28rpx;
	  color: #333;
	  flex: 1;
	}

</style>
