<template>
	<view>
		<view class="header">
			<span>扫码追溯</span>
			<uni-icons type="scan" color="#333" size="26" style="display: block;" @click="toScanAdd"></uni-icons>
		</view>
		<view class="flex-row">
			<view class="flex-cell ">
				<span>物料代码：</span>
				{{ detailHead.materielNo }}
			</view>
			<view class="flex-cell ">
				<span>物料名称：</span>
				{{ detailHead.materielName }}
			</view>
			<view class="flex-cell">
				<span>规格型号：</span>
				{{ detailHead.specification }}
			</view>
			<view class="flex-cell">
				<span>计量单位：</span>
				{{ detailHead.uomName }}
			</view>
			<view class="flex-cell">
				<span>批号：</span>
				{{ detailHead.batch }}
			</view>
			<view class="flex-cell">
				<span>入库数量：</span>
				{{ detailHead.count }}
			</view>
			<view class="flex-cell">
				<span>剩余数量：</span>
				{{ detailHead.remainCount }}
			</view>
		</view>
		<view class="head">入库出库明细</view>
		<view class="table_container">
			<t-table border="0">
				<view class="tr-body">
					<t-tr font-size="14" v-for="(item, index) in tableList" :key="index">
						<view class="tr_view">
							<t-td style='width:80px'>{{ item.dateType }}</t-td>
							<t-td class='t_td_cell'>{{ setTime(item.createTime)}}</t-td>
							<t-td  style='width:80px'>{{ item.countType }}</t-td>
							<t-td class='t_td_cell'>{{ item.count }}</t-td>
						</view>
					</t-tr>
				</view>
			</t-table>
		</view>

		<!-- <view class="goHome" @click="goMain()"><img src="@/static/img/gohome.png" /></view> -->
	</view>
</template>

<script>
import jweixin from '@/jweixin-module/index.js';
import tTable from '@/components/wms/t-table/t-table.vue';
import tTh from '@/components/wms/t-table/t-th.vue';
import tTr from '@/components/wms/t-table/t-tr.vue';
import tTd from '@/components/wms/t-table/t-td.vue';
import uniIcons from '@/components/uni-icons/uni-icons.vue';
export default {
	data() {
		return {
			detailHead: {
				materielName: ''
			},
			tableList: []
		};
	},
	components: {
		tTable,
		tTh,
		tTr,
		tTd,
		uniIcons
	},
	mounted() {
		this.initiateWX();
	},
	methods: {
		//获取微信相关
		initiateWX() {
			this.$http
				.request({
					url: '/apis/weChat/getSignature',
					params: {
						// url:"http://120.132.17.220:18090/gyhl-app/"
						url: window.location.href.split('#')[0]
					}
				})
				.then(res => {
					if (res.data.code == 0) {
						var s = res.data;
						jweixin.config({
							beta: true,
							debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
							appId: s.appId, // 必填，公众号的唯一标识
							timestamp: s.timestamp, // 必填，生成签名的时间戳
							nonceStr: s.nonceStr, // 必填，生成签名的随机串
							signature: s.signature.toLowerCase(), // 必填，签名，见附录1
							jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone', 'scanQRCode']
						});
					} else {
						uni.showToast({
							title: res.msg ? res.msg : '获取微信配置失败',
							icon: 'none',
							duration: 2000
						});
					}
				})
				.catch(err => {
					uni.showToast({
						title: err,
						icon: 'none',
						duration: 2000
					});
				});
		},
		toScanAdd() {
			let _this = this;
			jweixin.scanQRCode({
				desc: 'scanQRCode desc',
				needResult: 1, // 默认为0，扫描结果由企业微信处理，1则直接返回扫描结果，
				scanType: ['qrCode'], // 可以指定扫二维码还是条形码（一维码），默认二者都有"qrCode", "barCode"
				success: function(res) {
					if (res.errMsg != 'scanQRCode:ok') {
						uni.showToast({
							title: '扫描结果:' + res.resultStr,
							icon: 'none',
							duration: 2000
						});
					} else {
						//扫码正确
						let resultStr = res.resultStr;
						try {
							resultStr = JSON.parse(resultStr);
							if (resultStr.id) {
								_this.getQrCodeInfo(resultStr.id);
							} else {
								uni.showToast({
									title: '二维码错误，请扫描正确的二维码',
									icon: 'none',
									duration: 2000
								});
							}
						} catch (e) {
							uni.showToast({
								title: '二维码错误，请扫描正确的二维码',
								icon: 'none',
								duration: 2000
							});
						}
					}
					// 回调
				},
				error: function(res) {
					uni.showToast({
						title: 'error:' + res,
						icon: 'none',
						duration: 2000
					});
					if (res.errMsg.indexOf('function_not_exist') > 0) {
						alert('版本过低请升级');
					}
				}
			});
		},

		//调用接口获取二维码信息
		getQrCodeInfo(id) {
			this.$http
				.request({
					url: '/apis/scm/qrcode/logDetail',
					params: {
						qrCodeId: id
					},
					method: 'GET'
				})
				.then(res => {
					if (res.data.code == 0) {
						this.detailHead=res.data.header
						this.tableList=res.data.body
					}else{
						uni.showToast({
							title: res.data.msg? res.data.msg:'扫码失败',
							icon: 'none',
							duration: 2000
						});
					}
				});
		},
		setTime(time){
			if(time.split(' ')[0]){
				return time.split(' ')[0]
			}else {
				return time
			}
		}
	}
};
</script>

<style scoped>
.header {
	position: relative;
	width: 100%;
	height: 40px;
	background-color: #fff;
}
.header span {
	line-height: 40px;
	font-size: 15px;
	margin-left: 10px;
}
.header .uni-icon {
	position: absolute;
	right: 10px;
	top: 0px;
	padding: 7px;
}
.head {
	height: 40px;
	width: 100%;
	line-height: 40px;
	font-size: 15px;
	background-color: #fff;
	padding-left: 10px;
	margin-top: 10px;
}

.flex-row {
	position: relative;
	width: 100%;
	padding-right: 45px !important;
	background-color: #fff;
	margin-top: 10px;
}

.flex-cell {
	width: 100%;
	text-align: left;
	/* overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis; */
	min-height: 30px;
	line-height: 30px;
	font-size: 14px;
	padding-left: 10px;
	box-sizing: border-box;
}

.table_container {
	position: relative;
	width: 100%;
	margin: auto;
	margin-top: 10px;
	height: calc(100% - 91px);
	font-size: 13px;
	color: #333;
}
.t-table {
	position: relative;
	height: 100%;
	padding-bottom: 10px;
}
.tr-body {
	position: relative;
	width: 100%;
	left: 0;
	bottom: 0;
	overflow: auto;
	background-color: #fff;
}
.t-table .t-tr {
	position: relative;
	border-bottom: 1px solid #efefef;
}
.tr_view {
	/* position: relative;
		display: block;
		width: 100%; */

	position: relative;
	overflow: auto;
	width: 100%;
}
.tr-head {
	position: relative;
	top: 0;
	width: 100%;
}
.tr-head .t-th {
	display: inline-block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	width: calc((100% / 4));
}
.t-td {
	position: relative;
	box-sizing: border-box;
	float: left;
	/* width: calc((100% / 4)); */
	height: 33px;
	padding: 4px 0;
}
.t_td_cell{
	width: calc((100% - 160px) / 2);
}
</style>
