/* pages/device/list/list.wxss */ .container { min-height: 100vh; background-color: #F5F5F5; padding-bottom: 120rpx; } /* 搜索栏 */ .search-bar { padding: 24rpx 32rpx; background: #fff; } /* 筛选区域 */ .filter-section { display: flex; align-items: center; padding: 24rpx 32rpx; background: #fff; border-bottom: 1rpx solid #EEEEEE; } .filter-scroll { flex: 1; white-space: nowrap; } .filter-tags { display: inline-flex; gap: 16rpx; } .filter-tag { display: inline-block; padding: 12rpx 24rpx; background: #F5F5F5; border-radius: 32rpx; font-size: 26rpx; color: #666; white-space: nowrap; } .filter-tag.active { background: #E6F0FF; color: #0052D9; font-weight: bold; } .filter-tag.warning.active { background: #FFF7E6; color: #FF6B00; } .filter-tag.danger.active { background: #FFEBEE; color: #E34D59; } .filter-more { margin-left: 24rpx; padding: 12rpx; } /* 设备列表 */ .device-list { padding: 24rpx 32rpx; } .device-item { background: #fff; border-radius: 16rpx; padding: 32rpx; margin-bottom: 24rpx; box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05); } .device-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24rpx; padding-bottom: 24rpx; border-bottom: 1rpx solid #EEEEEE; } .device-name { font-size: 32rpx; font-weight: bold; color: #333; } .device-info { display: flex; flex-direction: column; gap: 16rpx; } .info-row { display: flex; font-size: 26rpx; line-height: 1.6; } .info-label { color: #999; min-width: 160rpx; } .info-value { flex: 1; color: #333; } .warning-text { color: #FF6B00; font-weight: bold; } .days-left { margin-left: 8rpx; font-size: 24rpx; } /* 空状态 */ .loading-container { display: flex; justify-content: center; align-items: center; padding: 80rpx 0; } /* 添加按钮 */ .fab-button { position: fixed; right: 48rpx; bottom: 120rpx; width: 112rpx; height: 112rpx; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 8rpx 24rpx rgba(102, 126, 234, 0.4); z-index: 100; } /* 筛选弹窗 */ .filter-dialog { padding: 32rpx; } .filter-group { margin-bottom: 32rpx; } .filter-group:last-child { margin-bottom: 0; } .filter-group-title { font-size: 28rpx; font-weight: bold; color: #333; margin-bottom: 24rpx; } .filter-options { display: flex; flex-wrap: wrap; gap: 16rpx; } .filter-option { padding: 16rpx 32rpx; background: #F5F5F5; border-radius: 32rpx; font-size: 26rpx; color: #666; border: 2rpx solid transparent; } .filter-option.selected { background: #E6F0FF; color: #0052D9; border-color: #0052D9; font-weight: bold; }