<template>	
	<view class="content">	
		<button type="primary" class="button" @tap="Index" size="mini">首页</button>
		<button type="primary" class="button" @click="MechanicalArm2()" size="mini">机械臂2 </button>
		<button type="primary" class="button" @click="MechanicalArm3()" size="mini">机械臂3 </button>
		<button type="primary" class="button" @click="Download()" size="mini">下载</button>
		<view   v-for="(item,name,index) in 22" :key="index">
			<view class="propertyBox" >
				<view  class="propertyBox" v-for="(itema,indexa) in xyzr" :key="indexa">
					<text>Axis_{{itema}}{{index}}:</text>
					<view class="text-color">
				        <text>{{Arr[index * 4 + indexa] }}</text>		
					</view>	
				</view> 		   
			</view>	
		
			<view class="propertyBox" >
				<view class="mytest" v-for="(itemb,indexb) in sandxyzr" :key="indexb">						
				    <input type="type" v-model="Send[((index) * 4) + indexb]" value="Send[((index) * 4) + indexb]" />
				</view>	
			</view>	
		</view>	
	</view>
</template>

<script>
	var _self;
	import process from '../../utils/process.js'
	const db = uniCloud.database();
	export default {
		data() {
			return {			
				xyzr:['X','Y','Z','R'],
				sandxyzr:['x','y','z','r'],
				Arr: [],	
				Send:[],
				timer: null
			} 
		},
		onShow() {
			process.bushu = 0	 //检测位置写入按下
			//手动刷新
			for (let cnta = 0; cnta < 22; cnta++) {
				this.Send[cnta * 4 + 0] = process.glbStrSendData_FFCC.sendAxis_x[cnta]
				this.Send[cnta * 4 + 1] = process.glbStrSendData_FFCC.sendAxis_y[cnta]
				this.Send[cnta * 4 + 2] = process.glbStrSendData_FFCC.sendAxis_z[cnta]
				this.Send[cnta * 4 + 3] = process.glbStrSendData_FFCC.sendAxis_r[cnta]  
			} 		
			 this.timer = setInterval(() => {
			 this.ReadData();           //显示数据
			 this.InputCoordinate();    //发送数据
			}, 100);
		}, 
		onLoad(option) {			
			 _self = this;  
		},
		onHide() {
			console.log('onHide');
			clearInterval(this.timer);
			this.timer = null;
		},
		methods: {	
			//跳转到首页
			Index() {
			  uni.navigateTo({
					url: '/pages/cottonCandy/index'
				})
			},
			//跳转机械臂2界面
			MechanicalArm2() {
				 uni.navigateTo({
					url: '/pages/cottonCandy/MechanicalArm2'
				})	
			},
			//跳转机械臂3界面
			MechanicalArm3() {
				 uni.navigateTo({
					url: '/pages/cottonCandy/MechanicalArm3'
				})
			},
			Download() {
				db.collection('DataSave').where('machine_id == "001"').get().then((res) => {
					const DownloadData = res.result.data[0] 		
					//从数据库下载的数据传个 输入框的数组xyzr轴坐标里
					for (let cnti = 0; cnti < 22 ; cnti++) {                                  //xyzr轴坐标		
					    _self.Send[cnti * 4 + 0] = DownloadData.SavteData.sendAxis_x[cnti]
					    _self.Send[cnti * 4 + 1] = DownloadData.SavteData.sendAxis_y[cnti]
					    _self.Send[cnti * 4 + 2] = DownloadData.SavteData.sendAxis_z[cnti]
					    _self.Send[cnti * 4 + 3] = DownloadData.SavteData.sendAxis_r[cnti]    
					}
				})	
			},
			//处理数据
			ReadData() {			
				_self.Arr = [0];       //显示数据数组赋值
				for(let cnti = 0; cnti < 22; cnti++) {
					_self.Arr[cnti * 4 + 0] = process.recData.recAxis_x[cnti]
					_self.Arr[cnti * 4 + 1] = process.recData.recAxis_y[cnti]
					_self.Arr[cnti * 4 + 2] = process.recData.recAxis_z[cnti]
				    _self.Arr[cnti * 4 + 3] = process.recData.recAxis_r[cnti]	
				} 
			},
			InputCoordinate() { 
				for (let cnta = 0; cnta < 22; cnta++) {
					  // 判断 当前步数 是多少步  process.recData1.recCurrentSteps
						if ( 1 === process.bushu)  {
							 _self.Send[cnta * 4 + 0] = process.glbStrSendData_FFCC.sendAxis_x[cnta]  
							 _self.Send[cnta * 4 + 1] = process.glbStrSendData_FFCC.sendAxis_y[cnta]  
							 _self.Send[cnta * 4 + 2] = process.glbStrSendData_FFCC.sendAxis_z[cnta]  
							 _self.Send[cnta * 4 + 3] = process.glbStrSendData_FFCC.sendAxis_r[cnta]	 
						}
						if ( 0 === process.bushu)  {				 	 									
							 process.glbStrSendData_FFCC.sendAxis_x[ cnta] = this.Send[cnta * 4 + 0]
							 process.glbStrSendData_FFCC.sendAxis_y[ cnta] = this.Send[cnta * 4 + 1]
							 process.glbStrSendData_FFCC.sendAxis_z[ cnta] = this.Send[cnta * 4 + 2]
							 process.glbStrSendData_FFCC.sendAxis_r[ cnta] = this.Send[cnta * 4 + 3]	
						}			   
				}
			}		
		}
	}
</script>

<style scoped>
.button {
	height: 60rpx;
	width: 200rpx;
	margin-top: 15rpx;
	margin-left: 40rpx;
	border-radius: 10rpx;
}
.propertyBox{
	margin-top: 5rpx;
	flex-flow: row;
	justify-content: space-evenly;
	display: flex;	
}
.text-color{
	border: 3rpx solid dodgerblue;
}
.mytest input{
	border: 1rpx solid black;
	width: 100rpx;
}
</style>
