$load("Page_Head.htm")
<link rel="stylesheet" type="text/css" href="{$atplPath}skin/admin2013_child.css" />
<link rel="stylesheet" type="text/css" href="{$atplPath}skin/house_pingtai.css" />
<style>
.wechat_box .wechat_head,.wechat_box .wechat_foot .keyb { background:url("{$atplPath}images/wechat_devPT_ico.png") no-repeat 0 0;}

.qrleft { float: left;width: 390px; text-align: center;}
.qrleft .tit { font-size: 18px; margin: 20px 0 10px;}
.qrleft .tit2 { font-size: 14px; color: #999; margin: 20px 0 0;}
.qrleft .c_Qr { width: 200px; height: 200px; vertical-align: top;}

.wechat_box { float: right; width:360px; height:460px; padding-top:70px; border: 1px solid #ddd; background-color: #ededed; position:relative; z-index:1;}
.wechat_box .wechat_head { position:absolute; top:0; left:0; right:0; height:34px; text-align:center; color:#fff; padding-top:36px; font-size:16px;}
.wechat_box .wechat_foot { position:absolute; bottom: 0; left: 0; right: 0; border-top:1px solid #ddd; height:50px; background-color:#fafafa;}
.wechat_box .wechat_foot ul { display:flex;}
.wechat_box .wechat_foot ul li { flex:2; border-right:1px solid #ddd; position:relative; z-index:1; vertical-align:top; text-align:center;}
.wechat_box .wechat_foot ul li:last-child { border-right:0 none;}
.wechat_box .wechat_foot ul li.menu { flex:1;}
.wechat_box .wechat_foot .keyb { display:block; width:25px; height:31px; background-position:-31px -71px; margin:9px auto 0;}
.wechat_box .inner { position: relative; z-index: 1; margin: 10px;}
.wechat_box .inner .pic { position: absolute; left: 0; top: 0;}
.wechat_box .inner .pic img { display: block; width: 30px; height: 30px; background-color: #fff; border-radius: 3px; padding: 3px;}
.wechat_box .inner .txt { margin-left: 48px; background-color: #fff; padding: 10px; width: 200px; border-radius: 4px;}
.wechat_box .inner .txt::before { display: block; content: ''; width: 0; height: 0; border: 5px solid #fff; border-color: transparent #fff transparent transparent; position: absolute; left: 38px; top: 14px;}
.wechat_box .inner .txt h3 { font-size: 14px; font-weight: normal; color: #333; margin: 0 0 5px;overflow:hidden;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;box-orient:vertical;display:-webkit-box;display:box;}
.wechat_box .inner .txt p { word-break: break-all; line-height: 20px; min-height: 60px; font-size: 12px; color: #999;overflow:hidden;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;box-orient:vertical;display:-webkit-box;display:box;}
.wechat_box .inner .txt p img { float: right; margin-left: 8px; width: 60px; height: 60px;}
.wechat_box .timer { text-align: center; font-size: 12px; color: #aaa; margin-top: 15px;}
</style>
<script src="{$Default_tplPath}js/jquery-1.10.2.min.js"></script>
<script src="{$Default_tplPath}js/purl.js"></script>
<script>
var url_obj = $.url(window.location.href).param();
window['pageid']='1';
if(!!url_obj['p'] && url_obj['p']!==''){
	if(!isNaN(url_obj['p'])){
		window['pageid'] = url_obj['p'];
	}
}
window['cookieName'] = 'myJuBaoid';
window['apiurl'] = '/api/QRCode/GetPagedQRCodes';
window['keyvalues'] = {
	"pageid":window['pageid'],
	'PageSize':'20',
	'search':''
};
</script>
<div class="wrapper">
	<div id="app" style="display:none;">
		<div style="margin: 0; font-size: 20px;"><div class="right" style="padding: 0px;"><a href="Create" class="global2_btn_blue global2_btn_add">鍒涘缓浜岀淮鐮?/a></div>鍚哥矇浜岀淮鐮?/div>
		<div class="tips-h1" style="margin: 20px 0;"><div class="tip">
			<p>鏈簲鐢ㄥ彲浠ョ敤鏉ョ敓鎴愯嚜瀹氫箟寰俊鍒嗕韩鍐呭涓斿甫鍏紬鍙峰紩瀵煎叧娉ㄧ殑浜岀淮鐮侊紝灏嗙粰鎮ㄧ殑鍚哥矇锛屾帹骞垮甫鏉ユ瀬澶х殑鏂逛究鍜岀伒娲绘€э紝鑰屼笖鍚庡彴鑳界粺璁″埌姣忎釜浜岀淮鐮佸甫鏉ョ殑鍚哥矇鏁堟灉</p>
			<p>浣跨敤绀轰緥锛氭瘮濡傜粰姣忎釜鎺ㄥ箍娓犻亾(鎴栦汉鎴栦簨浠?寤虹珛涓€涓笓灞炰簩缁寸爜锛屽皢璇ヤ簩缁寸爜搴旂敤鍒板叾鍚勮嚜鐨勬帹骞夸腑锛岀郴缁熷彲浠ュ疄鏃剁粺璁″埌姣忎釜娓犻亾甯︽潵鐨勫惛绮夊拰寮曟祦鏁堟灉 </p>
			<p>鑻ョ敤鎴峰凡缁忓叧娉ㄥ叕浼楀彿锛屾壂鐮佸悗灏嗗嚭鐜扮殑鏄叕浼楀彿鍏虫敞椤甸潰锛岀偣鍑诲叧娉ㄥ悗锛屽湪鍏紬鍙峰璇濇涓皢鎮ㄨ缃殑鍒嗕韩鍐呭鍙戦€佺粰鐢ㄦ埛</p>
			<p>鑻ョ敤鎴峰凡缁忓叧娉ㄥ叕浼楀彿锛屾壂鐮佸悗灏嗙洿鎺ュ湪鍏紬鍙峰璇濇涓皢鎮ㄨ缃殑鍒嗕韩鍐呭鍙戦€佺粰鐢ㄦ埛</p>
		</div></div>
		<table align="center" cellpadding="2" width="100%" cellspacing="0" class="toptable grid table_style table_style_2017" border="0">
			<tr>
				<th>鍒嗕韩灏侀潰</th>
				<th>鏍囪瘑</th>
				<th width="500">鍒嗕韩鍐呭</th>
				<th>浜岀淮鐮佹湁鏁堟湡</th>
				<th>鐢熸垚鏃堕棿</th>
				<th>鎺ㄩ€佹鏁?/th>
				<th>甯︽潵鍏虫敞</th>
				<th>浜岀淮鐮?/th>
				<th>鏁版嵁缁熻</th>
				<th>鎿嶄綔</th>
			</tr>
			<tr is="item" v-for="(item,index) in displayedItems" :key="item.id" :item="item" :index="index"></tr>
			<tbody>
				
		</tbody></table>
		<div class="pageNavigation" id="pageNavigation"></div>
		<div class="agent_tips_window agent_tips_window2" style="display:block;height:664px;margin-top:-332px;" v-show="agent_tips_window">
			<div class="hd">
				<a href="#" @click.prevent="agent_tips_window=false" class="close">X</a>
				<span>鏌ョ湅浜岀淮鐮?/span>
			</div>
			<div class="clearfix" style="padding: 15px;">
				<div class="qrleft">
					<div class="tit">浣跨敤寰俊鎵弿</div>
					<img :src="c_Qr" class="c_Qr" />
					<div class="tips-h1" style="margin: 20px 0; text-align: left;"><div class="tip">
						<p>鍙互鐩存帴鍙抽敭鈥滃彟瀛樹负鈥濆皢鍥剧墖涓嬭浇鍒版湰鍦帮紝浣嗘槸闇€瑕佹墜鍔ㄤ慨鏀规枃浠跺悗缂€鍚嶄负.jpg</p>
					</div></div>
				</div>
				<div class="right" style="width: 362px;">
					<div style=" font-size: 18px; color: #333; font-weight: bold; margin-bottom: 10px; text-align: center;">鏁堟灉棰勮</div>
					<div class="wechat_box">
						<div class="wechat_head">{$SiteName}</div>
						<div class="timer">涓婂崍 10:36</div>
						<div class="inner">
							<a :href="c_Link" target="_blank">
								<div class="pic"><img src="{$atplPath}images/logo.2d08a3a0.png" /></div>
								<div class="txt">
									<h3>{{c_Title}}</h3>
									<p class="clearfix"><img :src="c_ImageUrl" v-if="c_ImageUrl" />{{c_Summary}}</p>
								</div>
							</a>
						</div>
						<div class="wechat_foot"><ul class="clearfix"><li class="menu"><span class="keyb"></span></li></ul></div>
					</div>
				</div>
				
			</div>
		</div>
		<div class="mask" style="display:block;" v-if="agent_tips_window"></div>
	</div>
</div>
<script type="text/x-template" id="page-template">
<tr :id="'item'+item.Id" align="center">
	<td><img :src="item.ImageUrl" style="width:80px; vertical-align:top;" /></td>
	<td>{{item.CategoryName}}</td>
	<td align="left">
		<p>鏍囬锛歿{item.Title}}</p>
		<p>鎽樿锛歿{item.Summary}}</p>
		<p>閾炬帴锛歿{item.Link}}</p>
	</td>
	<td><span v-if="item.IsForever">姘镐箙鏈夋晥</span><span v-else>{{item.ExpireTime}}鍒版湡</span></td>
	<td>{{item.CreateTime}}</td>

	<td>{{item.ViewTimes}}娆?/td>
	<td>{{item.SubscribeNums}}娆?/td>
	<td><a href="#" @click.prevent="view(item,index)" class="sys_btn_a">鏌ョ湅</a></td>
	<td><a :href="'Detail?sid='+item.Id" class="sys_btn_a">鏌ョ湅</a></td>
	<td>
		<a href="#" @click.prevent="xuqi(item.Id,index)" v-if="!item.IsExpire&&!item.IsForever" class="sys_btn_a"><i class="edit"></i>缁湡</a>
		<a href="#" @click.prevent="del([item.Id],index)" class="sys_btn_a"><i class="del"></i>鍒犻櫎</a>
	</td>
</tr>
</script>
<script src="{$Default_tplPath}js/jquery.cookie.js"></script>
<script src="{$atplPath}js/vue/axios.min.js"></script>
<script src="{$atplPath}js/vue/es6-promise.auto.min.js"></script>
<script src="{$atplPath}js/vue/vue.min.js"></script>
<script src="{$atplPath}js/house_admin_2018.js"></script>
<script src="{$atplPath}js/MSGwindowShow.js"></script>
<script>
var Item = {
	props: ['item','index'],
	methods: {
		view:function(tag,index){
			var that = this,tp = that.{$"$parent"},url='/api/WeChatPublic/GetQRCodeByTicket?ticket='+tag.Ticket;
			
			axios.get(url).then(function(res){
				if(typeof res.data.iserror !== 'undefined' && res.data.iserror === 1){
					Sys_showToast({title:res.data.data});
					return;
				}
				var Data = res.data;
				tp.c_Qr = Data;
			}).catch(function(err){console.log(err);});
			tp.c_ImageUrl = tag.ImageUrl;
			tp.c_Link = tag.Link;
			tp.c_Title = tag.Title;
			tp.c_Summary = tag.Summary;
			tp.agent_tips_window = true;
		},
		del:function(id_arr,index){
			if(!window.confirm('鎮ㄧ‘瀹氳鍒犻櫎璇ヤ簩缁寸爜鍚楋紵')){return false;}
			var that = this,tp = that.{$"$parent"},url='/api/QRCode/Delete';
			$.ajax({
				url:url,
				type:"POST",
				dataType:"json",
				contentType:"application/json;charset=utf-8",
				data: JSON.stringify(id_arr),
				success:function(res){
					if(typeof res.iserror !== 'undefined' && res.iserror === 1){
						Sys_showToast({title:res.data});
						return;
					}
					tp.displayedItems.splice(index,1);
				}
			});
		},
		xuqi:function(sid,index){
			var that = this,tp = that.{$"$parent"},url='/api/QRCode/SetExpireStatus?id='+sid;
			axios.post(url).then(function(res){
				if(typeof res.data.iserror !== 'undefined' && res.data.iserror === 1){
					Sys_showToast({title:res.data.data});
					return;
				}
				var Data = res.data;
				Sys_showToast({title:'缁湡鎴愬姛锛?,type:'success'});
				tp.getNewData();
			}).catch(function(err){console.log(err);});
		}
	},
	template: '#page-template'
};
var mylist = new Vue({
	el: '#app',
	components: {
		'item': Item
	},
	data: {
		agent_tips_window:false,
		ifLoadding:false,
		ifNoMore:false,
		displayedItems: [],
		CurrentPage:1,
		TotalPage: 0,
		TotalRecord:0,
		c_Qr: "",
		c_ImageUrl: "",
		c_Link:'',
		c_Title:'',
		c_Summary:''
	},
	methods: {
		filterClick:function(obj){//鐘舵€佽繃婊?
			var that = this,key;
			window['keyvalues'] = $.extend(window['keyvalues'],obj,{"PageID":"1"});
			for(key in obj){
				that[key] = obj[key];
			}
			that.getNewData();
		},
		setPageList:function(){
			var that = this;
			var result =  makePageListMenu(that.TotalPage,that.CurrentPage);
			$('#pageNavigation').html(result);
		},
		getNext:function(){
			var that = this;
			window['keyvalues'].pageid = parseInt(window['keyvalues'].pageid)+1
			that.CurrentPage = parseInt(window['keyvalues'].pageid);
			that.getData();
		},
		getNewData:function(){
			var that = this;
			that.displayedItems = [];
			that.ifNoMore = false;
			that.getData();
		},
		getData: function () {
			var that = this;
			that.CurrentPage = parseInt(window['keyvalues'].pageid);
			that.ifLoadding = true;
			axios.get(window['apiurl'],{params:window['keyvalues']}).then(function(res){
				if(typeof res.data.iserror !== 'undefined' && res.data.iserror === 1){
					that.ifNoMore = true;
					that.ifLoadding = false;
					return;
				}
				var Data = res.data.Data;
				that.TotalPage = parseInt(res.data.TotalPage)
				that.TotalRecord = parseInt(res.data.TotalRecord);
				that.setPageList();
				history.pushState(null, '', '?p='+that.CurrentPage);
				if(that.TotalPage===0){
					return false;
				}
				for(var i=0;i<Data.length;i++){
					Data[i].CreateTime = formatTime(new Date(Data[i].CreateTime));
					if(Data[i].ExpireTime){
						Data[i].ExpireTime = formatTime(new Date(Data[i].ExpireTime));
					}
				}
				Data.length>0 ?(that.displayedItems = that.displayedItems.concat(Data)):'';
				that.ifLoadding = false;
				(that.TotalPage===0) && (that.ifNoMore = true);
				(that.TotalPage===that.CurrentPage || that.TotalPage<that.CurrentPage) && (that.ifNoMore = true,that.CurrentPage=that.TotalPage);
			}).catch(function(err){console.log(err);});
		}
	},
	created: function () {
		$('#app').show();
		var that = this;
		that.getData();
	}
});
</script>
$load("Page_Foot.htm")