<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="utf-8" />
		<meta http-equv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<meta name="format-detection" content="telephone=no" />
		<title>潜山市党建引领信用村(社区)建设</title>
		<meta name="keywords" content="潜山市党建引领信用村(社区)建设">
		<meta name="description" content="潜山市党建引领信用村(社区)建设">
		<script src="static/js/vue.js"></script>
		<script type="text/javascript" src="static/js/vue-router.js"></script>
		<script src="static/js/index.js" type="text/javascript"></script>
		<script type="text/javascript" src="./static/js/jquery.min.js"></script>
		<script src="static/js/common.js"></script>
		<link href="static/css/common.css" rel="stylesheet" />
		<link href="static/css/style.css" rel="stylesheet" />
		<link rel="stylesheet" href="static/css/theme-chalk/index.css">

		<style></style>
	</head>
	<body class="qduse">
		<div id="appse">
			<header>
				<div class="quset">
					<div class="qusetimg"><img src="static/images/back.png" class="backimg" /></div>
					使用记录
				</div>
			</header>
		</div>
		<div id="app">
			<main>
				<div class="quse" v-if='usearr.length'>
					<div class="qusetime" :class="actidx==item?'act':''" v-for="(item,key) in usearr" :key="key">
						<div class="f24 c0 flexc pd2 qusetimea" @click="getLook(item)">{{item}}<img
								src="static/images/up.png" class="quseup" /></div>
						<div class="quse_txt" v-for="(ite,idx) in uselist[item]" :key="idx">
							<div class="quse_icon"><span></span>{{ite.createTime}}</div>
							<ul>
								<li>
									<div class="flex0">福利类型：</div>{{ite.recordType}}
								</li>
								<li>
									<div class="flex0">福利名称：</div>{{ite.recordName}}
								</li>
								<li>
									<div class="flex0">使用次数：</div>{{ite.useNum}}
								</li>
								<li>
									<div class="flex0">剩余次数：</div>{{ite.surplusNum}}
								</li>
							</ul>
						</div>
					</div>
					
				</div>
				<!-- 暂无记录 -->
				<div v-else class="nobox">
					<img src="static/images/nico.png" class="noimg"/>
				</div>
			</main>
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: '#app',
				data: {
					uselist: {},
					base_url: 'http://118.31.23.65:5007/prod-api',
					actidx: -1,
					usearr: [],
				},
				created() {
					this.creditId = decodeURI(this.getQueryString("creditId"))
					this.getDataFn()
				},
				mounted() {
				},
				methods: {
					getLook(e) {
						if (this.actidx == e) {
							this.actidx = -1
						} else {
							this.actidx = e;
						}

					},
					getQueryString(name) {
						try {
							var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
							var r = window.location.href.split('?')[1].match(reg);
							if (r != null) {
								return r[2];
							}
							return ""; //如果此处只写return;则返回的是undefined
						} catch (e) {
							return ""; //如果此处只写return;则返回的是undefined
						}
					},
					getDataFn() {
						var that = this;
						$.ajax({
							url: this.base_url + '/system/h5/record/' + that.creditId,
							type: 'GET',
							data: '',
							dataType: 'json',
							success: function(res) {
								if (res.code == 200) {
									that.uselist = res.data || {};
									// 数组排序
									that.usearr = Object.keys(res.data).sort(
										function(a, b) { //从小到大排序
											if (a > b) return -1; //位置不变
											else return 1; //交换位置
										}
									)
									that.actidx = that.usearr[0]
									// that.usearr.forEach(i=>{
									// 	console.log(i,res.data[i])
									// })

								} else {
									that.$message({
										message: res.msg,
										type: 'error',
										center: true,
									});
								}
							}
						})
					}
				}
			})
		</script>
		<script type="text/javascript">
			$(document).ready(function() {
				$('.backimg').click(function() {
					window.history.go(-1)
				})
			})
		</script>
	</body>
</html>
