<template>
	<view class="">
		<uni-collapse :show-animation="true">
			<view class="titlelist" style="position: relative;" v-for="equipment in merchantList[0].equipmentList" :key="equipment.id">
				<uni-collapse-item :title="getEquipmentTitle(equipment)">
					<uni-list>
						<uni-list-item title="使用统计" note="单台机器的使用次数统计" @click="useStatistics(equipment.id,equipment.name)" thumb="../../static/img/统计.png"></uni-list-item>
						<uni-list-item title="清洗规则" note="设定机器每天的清洗时间段" @click="rule(equipment.id,equipment.name,equipment.rule)" thumb="../../static/img/任务.png"></uni-list-item>
						<uni-list-item title="支付" note="按天数/次数支付" show-extra-icon="true" thumb="../../static/img/支付.png"></uni-list-item>
						<uni-list-item title="参数调整" thumb="../../static/img/参数.png"></uni-list-item>
					</uni-list>
				</uni-collapse-item>
			</view>
		</uni-collapse>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from 'vuex'
	import uniCollapse from '@/components/uni-collapse/uni-collapse.vue'
	import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue'
	import uniList from '@/components/uni-list/uni-list.vue'
	import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
	import {
		dateUtils
	} from '@/common/util.js';
	export default {
		components: {
			uniCollapse,
			uniCollapseItem,
			uniList,
			uniListItem,
		},
		data() {
			return {
				globalUser: {},
				merchantList: [{
					equipmentList: []
				}],
				extraIcon: {
					color: '#4cd964',
					size: '22',
					type: 'spinner'
				},
				statusNormal: 'status-normal',
				statusError: 'status-error',
				sleepChecked: null,
				onffChecked: null,
				time: null,
				timeAll: {

				},
			}
		},
		computed: {
			...mapState(['loginUser']),
		},
		onShow() {
			this.globalUser = uni.getStorageSync("globalUser");
			// uni.setNavigationBarTitle({
			// 	title: this.$t('equipmentStatusList.title')
			// });
			// uni.setTabBarItem({
			// 	index: 3,
			// 	text: this.$t('tabs.tab4')
			// });
			var token = uni.getStorageSync("token");
			if (token.length > 1) {
				this.getEquipmentListData();
			} else {
				uni.reLaunch({
					url: '../Login/Login',
				});
			}

		},
		methods: {
			...mapActions('chart', ['getEquipmentListByUser']),
			getEquipmentTitle(equipment) {
				return equipment.name ? equipment.name : '暂无名称';
			},
			getEquipmentListData() {
				this.getEquipmentListByUser(this.globalUser)
					.then(data => {
						this.merchantList = data;
						var listName = data[0].equipmentList;
						var listId = data[0].id;
						if (listId != null && listId != '1') {
							uni.setStorageSync("listName", listName);
						}
						uni.stopPullDownRefresh();
					}, _ => void uni.stopPullDownRefresh());
			},
			useStatistics(equipmentId,equipmentName) {
				uni.setStorageSync('nowEquipmentId', equipmentId);
				uni.setStorageSync('nowEquipmentName', equipmentName);
				uni.navigateTo({
					url: 'singleStatistics',
				});
			},
			rule(equipmentId,equipmentName,rule){
				uni.setStorageSync('nowEquipmentId', equipmentId);
				uni.setStorageSync('nowEquipmentName', equipmentName);
				if(rule!=''){
					uni.setStorageSync('nowEquipmentRule', rule);
				}
				
				uni.navigateTo({
					url: 'cleanRule',
				});
			},
		}
	}
</script>

<style>
	.titlelist {
		color: #363D44;
		font-size: 16upx;
		font-family: "PingFang-SC-Medium";
	}
</style>
