鎷╁伓瑕佹眰-{$platformname}

璁剧疆鎮ㄥ績鐩腑鐞嗘兂鐨凾a 浣嗗線寰€鐪熸鍦ㄤ竴璧风殑閭ｄ釜浜猴紝涔熻璺熻繖浜涙潯浠跺苟涓嶇浉绗?/span>

浣忔埧

鍙栨秷

纭畾

鍚哥儫

鍙栨秷

纭畾

鍠濋厭

鍙栨秷

纭畾

骞撮緞

{{startStep}}-{{endStep}}

韬珮(cm)

{{startStep2}}-{{endStep2}}

鏈堟敹鍏?鍏?

瀛﹀巻(鏈€澶氶€夋嫨涓夐」)

{{tag.Chrcategory}}

鐞嗘兂鑱屼笟(鏈€澶氶€夋嫨涓夐」)

{{tag.Chrcategory}}

濠氬Щ鐘舵€?span style="font-weight: normal;font-size: 12px;color: #aaa;margin-left: 10px;">(鏈€澶氶€夋嫨涓夐」)

{{tag.Chrcategory}}

浣忔埧

鍚哥儫

鍠濋厭

瑕佹眰琛ュ厖

</div>
        <div class="m-surebuy">
            <div class="wp">
                <button type="submit" class="sure">瀹屾垚</button>
            </div>
        </div>
    </div>
</form>
{$bottom$}
<div class="mask" id="mask"></div>
<script type="text/javascript" src="{$Default_tplPath}js/vue/es6-promise.auto.min.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/vue/axios.min.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/vue/vue.min.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/purl.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/jquery.cookie.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/form_2018.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/houseCategory.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/json2.js"></script>
<script src="{$Default_tplPath}js/jqueryweui/jquery-weui.min.js"></script>
<script src="{$Default_tplPath}js/mobileSelect.min.js"></script>
<script type="text/javascript" src="{$Default_tplPath}js/wap_love.js"></script>
<script>
function setMultipleSel(data,sid,vueName){
	var data2=mypage[vueName];
	for(var i=0; i<data.length;i++){
		data[i].checked = false;
		for(var k =0;k<data2.length;k++){
			if(data2[k]===data[i].Categoryid){
				data[i].checked = true;
			}
		}
	}
	mypage[vueName+'List'] = data;
	if(data2.length!==0){
		mypage.bindMultipleSel2(vueName);
	}
}
var mypage = new Vue({
	el: '#app',
	components: {
	},
	data: {
		marriage:[],marriageList:[],marriageName:'',
		friendxueliExtend:[],friendxueliExtendList:[],friendxueliExtendName:'',
		friendJobs:[],friendJobsList:[],friendJobsName:'',
		id:0,
		FriendRequirements:'',
		drinkList:[],
		smokeList:[],
		
		
		friendchryearIndexArr:[],
		friendchryearStart:0,
		friendchryearEnd:0,
		friendheightExtendIndexArr:[],
		friendheightExtend:0,
		friendheightExtend1:0,

$ruler: '', // 婊戠
		$bar: '', // 宸︿晶婊戝潡
		$endbar: '', // 鍙充晶婊戝潡
		$line: '', // 婊戝潡涓棿绾?
		startX: '', // 宸︿晶婊戝潡浣嶇疆
		endX: '', // 鍙充晶婊戝潡浣嶇疆
		step: '', // 婊戠鍦ㄩ檺瀹氳寖鍥村唴鍙互鍒嗗灏戞
		intervalStart: 20, 
		intervalEnd: 70,
		startStep: 20,
		endStep: 70,
		amountW: '', //  婊戠澶氶暱璺濈

$ruler2: '', // 婊戠
		$bar2: '', // 宸︿晶婊戝潡
		$endbar2: '', // 鍙充晶婊戝潡
		$line2: '', // 婊戝潡涓棿绾?
		startX2: '', // 宸︿晶婊戝潡浣嶇疆
		endX2: '', // 鍙充晶婊戝潡浣嶇疆
		step2: '', // 婊戠鍦ㄩ檺瀹氳寖鍥村唴鍙互鍒嗗灏戞
		intervalStart2: 150, 
		intervalEnd2: 200,
		startStep2: 150,
		endStep2: 200,
		amountW2: '', //  婊戠澶氶暱璺濈

friendyuexinExtend:0,
		friendyuexinExtend_bak:0,
		friendyuexinExtendText:'涓嶉檺',

friendzhufangExtend:0,
		friendzhufangExtend_bak:0,
		friendzhufangExtendText:'涓嶉檺',

smoke:0,smokeText:'璇烽€夋嫨',
		drink:0,drinkText:'璇烽€夋嫨',
		smoke_bak:0,
		drink_bak:0,

isShowDrawerBox1:false,
		isShowDrawerBox2:false,
		isShowDrawerBox3:false,
		isShowDrawerBox4:false,
	},
	methods:{
		initSlider:function(){
			var vm = this;
			vm.$ruler = vm.$refs.ruler;
			vm.$bar = vm.$refs.bar;
			vm.$endbar = vm.$refs.endbar;
			vm.$line = vm.$refs.line;
			// 婊戠澶氶暱璺濈
			vm.amountW = vm.$ruler.clientWidth - vm.$bar.clientWidth; 
			// 鎬诲叡澶氬皯姝?
			vm.step = vm.amountW / (vm.intervalEnd - vm.intervalStart);
			var s = this.intervalEnd - this.intervalStart

var bi_end = 1-(this.intervalEnd - this.endStep)/s;
			var bi_end2 = (this.intervalEnd - this.endStep)/s;
			var bi_start = 1-(this.intervalEnd - this.startStep)/s;
			
			vm.$endbar.style.left = (vm.amountW*bi_end) + 'px'
			vm.$bar.style.left =  (vm.amountW*bi_start) + 'px'
			vm.$line.style.left =  (vm.amountW*bi_start) + 'px'
			vm.$line.style.right =  (vm.amountW*bi_end2) + 'px'
			
			vm.$ruler2 = vm.$refs.ruler2;
			vm.$bar2 = vm.$refs.bar2;
			vm.$endbar2 = vm.$refs.endbar2;
			vm.$line2 = vm.$refs.line2;
			// 婊戠澶氶暱璺濈
			vm.amountW2 = vm.$ruler2.clientWidth - vm.$bar2.clientWidth; 
			// 鎬诲叡澶氬皯姝?
			vm.step2 = vm.amountW2 / (vm.intervalEnd2 - vm.intervalStart2);
			var s2 = this.intervalEnd2 - this.intervalStart2

// 婊戝姩璺濈灏忎簬0 鎴栬€呭ぇ浜庢粦绔跨殑瀹藉害锛宺eturn鎺?
			if (slidedis < 0 || slidedis > vm.amountW) {
			return;
			}
			var ste = Math.round(slidedis / vm.step);
			if ((ste + vm.intervalStart) >= vm.endStep) {
			return;
			}
			vm.startStep = ste + vm.intervalStart;
			vm.$bar.style.left = (ste * vm.step) + 'px'
			vm.$line.style.left =  (ste * vm.step) + 'px'
		},
		startTouchmove2:function(e) {
			var vm = this;
			// 婊戝姩璺濈=褰撳墠婊戝潡x璺濈-鏈€寮€濮嬫粦鍧楄窛绂?
			var slidedis = e.touches[0].pageX - vm.$ruler2.offsetLeft;

// 婊戝姩璺濈灏忎簬0 鎴栬€呭ぇ浜庢粦绔跨殑瀹藉害锛宺eturn鎺?
			if (slidedis < 0 || slidedis > vm.amountW2) {
			return;
			}
			var ste = Math.round(slidedis / vm.step2);
			if ((ste + vm.intervalStart2) >= vm.endStep2) {
			return;
			}
			vm.startStep2 = ste + vm.intervalStart2;
			vm.$bar2.style.left = (ste * vm.step2) + 'px'
			vm.$line2.style.left =  (ste * vm.step2) + 'px'
		},
		endTouchstart:function(e) {
			var vm = this;
			// 寮€濮嬫粦鍔ㄦ椂婊戝潡鐨勪綅缃?
			vm.endX = e.touches[0].pageX; 
		},
		endTouchstart2:function(e) {
			var vm = this;
			// 寮€濮嬫粦鍔ㄦ椂婊戝潡鐨勪綅缃?
			vm.endX2 = e.touches[0].pageX; 
		},
		endTouchmove:function(e) {
			var vm = this;
			// 婊戝姩璺濈=褰撳墠婊戝潡x璺濈-鏈€寮€濮嬫粦鍧楄窛绂?
			var slidedis = e.touches[0].pageX - vm.$ruler.offsetLeft;
			if (slidedis < 0 || slidedis > vm.amountW) {
				return;
			}
			var ste = Math.round(slidedis / vm.step);
			if (vm.startStep >= (ste + vm.intervalStart)) {
				return;
			}
			vm.endStep = ste + vm.intervalStart;
			if(vm.endStep==70){
				vm.$endbar.style.left = ''
				vm.$endbar.style.right = '0px'
				vm.$line.style.right = '0px'
			}else{
				vm.$endbar.style.left = (ste * vm.step) + 'px'
				vm.$line.style.right = (vm.amountW - ste * vm.step) + 'px'
			}
		},
		endTouchmove2:function(e) {
			var vm = this;
			// 婊戝姩璺濈=褰撳墠婊戝潡x璺濈-鏈€寮€濮嬫粦鍧楄窛绂?
			var slidedis = e.touches[0].pageX - vm.$ruler2.offsetLeft;
			if (slidedis < 0 || slidedis > vm.amountW2) {
				return;
			}
			var ste = Math.round(slidedis / vm.step2);
			if (vm.startStep2 >= (ste + vm.intervalStart2)) {
				return;
			}
			vm.endStep2 = ste + vm.intervalStart2;
			if(vm.endStep2==200){
				vm.$endbar2.style.left = ''
				vm.$endbar2.style.right = '0px'
				vm.$line2.style.right = '0px'
			}else{
				vm.$endbar2.style.left = (ste * vm.step2) + 'px'
				vm.$line2.style.right = (vm.amountW2 - ste * vm.step2) + 'px'
			}
		},

bindMultipleSel:function(tag,forName){
			var that = this,data = that[forName+'List'],arr=[];
			for(var i=0;i<data.length;i++){
				if(data[i].checked){
					arr.push(data[i].Categoryid)
				}
			}
			if(arr.length>2&&!tag.checked){return}
			Vue.set(tag,'checked',!tag.checked);
			that.bindMultipleSel2(forName);
		},
		bindMultipleSel2:function(forName){
			var that = this,data = that[forName+'List'],arr=[];
			for(var i=0;i<data.length;i++){
				if(data[i].checked){
					arr.push(data[i].Chrcategory);
				}
			}
			that[forName+'Name'] = arr.join(',');
		},
		showMultipleSel:function(forName){
			var bottomFixedAnimation = $('#bottomFixedAnimation_'+forName);
			bottomFixedAnimation.slideDown();
			$('#mask').fadeIn();
		},
		hideMultipleSel:function(forName){
			var bottomFixedAnimation = $('#bottomFixedAnimation_'+forName);
			bottomFixedAnimation.slideUp();
			$('#mask').fadeOut();
		},
		//鍔犺浇鏁版嵁
		getData:function( sid ){
			var that = this,url = '/api/LoveUser/GetRequirements';
			axios.get(url).then(function(res){
				if(typeof res.data.iserror !== 'undefined' && res.data.iserror === 1){
					return;
				}
				var Data = res.data;
				for(var key in Data){
					that[key] = Data[key];
				}
				that.friendyuexinExtend_bak = Data.friendyuexinExtend
				that.friendzhufangExtend_bak = Data.friendzhufangExtend
				that.smoke_bak = Data.smoke
				that.drink_bak = Data.drink
				if(Data.friendchryearStart!==0){that.startStep = Data.friendchryearStart}
				if(Data.friendchryearEnd!==0){that.endStep = Data.friendchryearEnd}
				if(Data.friendheightExtend!==0){that.startStep2 = Data.friendheightExtend}
				if(Data.friendheightExtend1!==0){that.endStep2 = Data.friendheightExtend1}
				that.setmobileSelect();
			}).catch(function(err){console.log(err);});
		},
		setmobileSelect:function(){
			var that=this;
			getHouseCatJSON('1','2004','friendyuexinExtend',setQuyuSel_vue,[{Categoryid:0,Chrcategory:'鏀跺叆涓嶉檺'}]);
			getHouseCatJSON('1','2012','friendzhufangExtend',setQuyuSel_vue,[{Categoryid:0,Chrcategory:'浣忔埧涓嶉檺'}]);
			getHouseCatJSON('1','2003','marriage',setMultipleSel);
			getHouseCatJSON('1','2002','friendxueliExtend',setMultipleSel);
			getHouseCatJSON('1','2001','friendJobs',setMultipleSel);
			getHouseCatJSON('1','2010','drink',setQuyuSel_vue,[{Categoryid:0,Chrcategory:'鍠濋厭涓嶉檺'}]);
			getHouseCatJSON('1','2011','smoke',setQuyuSel_vue,[{Categoryid:0,Chrcategory:'鍚哥儫涓嶉檺'}]);
			that.$nextTick(() => {
				that.initSlider();
			});
		}
	},
	created:function(){
		$('#app').show();
		var that = this;
		that.getData();
		$('#myForm').loadForm('/api/LoveUser/ChangeRequirements',function(myForm){
			return true;
		},function(myForm,data){
			MSGwindowShow('house','1','鎻愪氦鎴愬姛浜嗗摝锛?,'/memberlove/myblind','',{icotype:'success',btntype:'',btntxt:'鎴戠煡閬撲簡',bd2txt:'',isCloseBtn:true});
		});
	}
});

}
</script>
</body>
</html>