You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
351 lines
7.7 KiB
351 lines
7.7 KiB
<template>
|
|
<view class="content">
|
|
<nav-bar isblack="true" bgColor="rgba(255,255,255,1)" fontColor="#000000" backState="3000"></nav-bar>
|
|
<view class="top" :style="{background: 'url('+getUrl('/r/cms/www/m/yushan/wf-ss-banner.png')+') center center no-repeat'}">
|
|
<view class="ttypebox">
|
|
<!-- 关键字 -->
|
|
<view class="ttype ttype100">
|
|
<input class="searchIpt" type="text" placeholder="请输入关键字" placeholder-style="color: rgba(255,255,255,0.5);" v-model="searchStr" />
|
|
<view class="searchBtn" @click="getData(1)">
|
|
<image class="Btnimg" :src="getImg('ra-liebiao-icon-sou.png')" mode="" ></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="main">
|
|
<view class="mainlist">
|
|
<view class="libox" v-for="(el, ind) in dataall" @click="navto(el.typeId,el.uuid,el.uid)">
|
|
<view class="liboxtop" :style="{background:el.logo == '' || el.logo == null? 'url(https://cs.tour-ma.com/r/cms/www/m/changshu/noimg.png) center no-repeat' : 'url(' + getUrl(el.logo) + ') center no-repeat'} ">
|
|
<view class="xing" :style="{ width: el.level * 29.6 + 'rpx' }"><image class="img" :src="getImg('ra-liebiao-icon-xing.png')" mode=""></image></view>
|
|
</view>
|
|
<view class="liboxbot">
|
|
<view class="title1">
|
|
<view class="name" v-text="el.name"></view>
|
|
<view class="xingji" v-show="el.level>0" v-if="el.typeId==1" v-text="el.level + 'A'"></view>
|
|
<view class="xingji" v-show="el.scapeType!='未定级'" v-if="el.typeId==199" v-text="el.scapeType"></view>
|
|
<view class="xingji" v-show="el.level>0" v-if="el.typeId!=1 && el.typeId!=199" v-text="el.level + '星'"></view>
|
|
<view class="price" v-if="el.price!=null&&el.price!=0" >
|
|
<view class="rmb">￥</view>
|
|
<view class="pricenum" v-text="el.price"></view>
|
|
</view>
|
|
</view>
|
|
<view class="title2">
|
|
<view class="address" v-text="el.address"></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
var web = require('@/components/utils/request.js');
|
|
export default {
|
|
data() {
|
|
return {
|
|
id: 0, //景区
|
|
uid:119,//栏目特色景区
|
|
nowdata:{
|
|
name:'全站搜索',
|
|
title:'',
|
|
contentImg:''
|
|
},
|
|
dataall: [],
|
|
searchStr: '',
|
|
levelname:'等级',
|
|
level:'',
|
|
scapeTypename:'类型',
|
|
scapeType:'',
|
|
lat:0,
|
|
lng:0
|
|
};
|
|
},
|
|
onLoad(option) {
|
|
this.searchStr=option.name;
|
|
this.getData();
|
|
},
|
|
mounted() {
|
|
|
|
},
|
|
methods: {
|
|
getUrl(url) {
|
|
return 'https://cs.tour-ma.com/'+url;
|
|
},
|
|
getImg(url) {
|
|
return 'https://cs.tour-ma.com/r/cms/www/m/yushan/' + url;
|
|
},
|
|
navto(typeId,uuid,wid){
|
|
if(typeId==1){
|
|
uni.navigateTo({
|
|
url:'/pages/jqDet?uid='+wid
|
|
});
|
|
}else if(typeId==2){
|
|
uni.navigateTo({
|
|
url:'/pages/jqDet?uid='+wid
|
|
});
|
|
}else if(typeId==3){
|
|
uni.navigateTo({
|
|
url: '/pages/jqDet?uid='+wid
|
|
});
|
|
}
|
|
|
|
},
|
|
|
|
getData(fl) {
|
|
var url = '/wareInfo/list4.jspx';
|
|
var para = {
|
|
ctgId: 0,
|
|
name:this.searchStr
|
|
};
|
|
var that = this;
|
|
web.httpPost(that, url, para, function(res) {
|
|
console.log(1111,res.data)
|
|
if (res.data.status == 200) {
|
|
that.dataall=[];
|
|
if(fl==1){
|
|
for(var i=0;i<res.data.results.length;i++){
|
|
that.dataall.push(res.data.results[i]);
|
|
}
|
|
}else{
|
|
for(var i=0;i<res.data.results.length;i++){
|
|
if(res.data.results[i].typeId==1||res.data.results[i].typeId==2||res.data.results[i].typeId==3){
|
|
that.dataall.push(res.data.results[i]);
|
|
}
|
|
}
|
|
}
|
|
|
|
// if(res.data.results[i].typeId==1||res.data.results[i].typeId==2||res.data.results[i].typeId==3){
|
|
// that.dataall=res.data.results;
|
|
// }
|
|
} else {
|
|
uni.showToast({
|
|
title: '查询失败'
|
|
});
|
|
}
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
.content {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
.top {
|
|
width: 100%;
|
|
height: 320upx;
|
|
background-size: 100% auto !important;
|
|
position: relative;
|
|
}
|
|
.tname {
|
|
position: absolute;
|
|
width: 300upx;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin-top: -100upx;
|
|
margin-left: -150upx;
|
|
text-align: center;
|
|
}
|
|
.tname .tnamezw {
|
|
font-size: 40upx;
|
|
font-weight: 500;
|
|
color: rgba(255, 255, 255, 1);
|
|
}
|
|
.tname .tnameen {
|
|
font-size: 28upx;
|
|
font-weight: 500;
|
|
color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
.ttypebox {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 92%;
|
|
height: 60upx;
|
|
position: absolute;
|
|
top: 50upx;
|
|
left: 4%;
|
|
}
|
|
.ttype {
|
|
width: 30%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
border: 1upx solid rgba(255, 255, 255, 0.4);
|
|
border-radius: 10upx;
|
|
padding: 12upx 20upx;
|
|
background-color: rgba(255, 255, 255, 0.3);
|
|
margin-right: 10upx;
|
|
line-height: 1.5rem;
|
|
position: relative;
|
|
}
|
|
.ttype100{
|
|
width: 100%;
|
|
}
|
|
.ttypebox .ttype:last-child {
|
|
margin-right: 0upx;
|
|
}
|
|
.ttype .txt {
|
|
color: rgba(255, 255, 255, 1);
|
|
font-size: 25upx;
|
|
margin-right: 10upx;
|
|
}
|
|
.ttype .iconbot {
|
|
width: 20upx;
|
|
height: 12upx;
|
|
}
|
|
.iconbot180{
|
|
transform: rotate(180deg);
|
|
}
|
|
.ttype .searchIpt {
|
|
font-size: 25upx;
|
|
color: rgba(255, 255, 255, 1);
|
|
}
|
|
|
|
.ttype .searchBtn {
|
|
width: 60upx;
|
|
height: 50upx;
|
|
position: relative;
|
|
}
|
|
.ttype .searchBtn .Btnimg{
|
|
width: 26upx;
|
|
height: 24upx;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin-top: -12upx;
|
|
margin-left: -13upx;
|
|
}
|
|
.listbox{
|
|
position: absolute;
|
|
top: 370upx;
|
|
left: 0;
|
|
z-index: 100;
|
|
border-radius: 0 0 10upx 10upx;
|
|
padding: 10upx 4% 10upx 4%;
|
|
background-color: rgba(255, 255, 255, 1);
|
|
text-align: left;
|
|
width: 92%;
|
|
box-shadow: 0upx 7upx 20upx -5upx #ccc;
|
|
}
|
|
.listbox .liname{
|
|
padding: 10upx 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.listbox .liname .litxt{
|
|
color: #7b797a;
|
|
font-size: 25upx;
|
|
}
|
|
|
|
.listbox .linamenow .litxt{
|
|
color: #FB7F60;
|
|
float: left;
|
|
}
|
|
|
|
.main {
|
|
padding: 7% 4%;
|
|
}
|
|
.mainlist {
|
|
}
|
|
.mainlist .libox {
|
|
margin-bottom: 7%;
|
|
border-radius: 20upx;
|
|
overflow: hidden;
|
|
box-shadow: 0upx 0upx 15upx 10upx #eee;
|
|
}
|
|
.libox .liboxtop {
|
|
width: 100%;
|
|
height: 370upx;
|
|
position: relative;
|
|
background-size: 100% 100% !important;
|
|
object-fit: cover;
|
|
}
|
|
.liboxtop .xing {
|
|
position: absolute;
|
|
top: 15upx;
|
|
left: 35upx;
|
|
overflow: hidden;
|
|
}
|
|
.liboxtop .xing .img {
|
|
width: 148upx;
|
|
height: 26upx;
|
|
}
|
|
.libox .liboxbot {
|
|
}
|
|
.liboxbot .title1 {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 20upx 0;
|
|
}
|
|
.title1 .name {
|
|
color: #333333;
|
|
font-weight: 600;
|
|
font-size: 38upx;
|
|
display: flex;
|
|
align-items: center;
|
|
width: 86%;
|
|
}
|
|
.title1 .name::before {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 8upx;
|
|
height: 48upx;
|
|
background: url(https://ys.tour-ma.com/r/cms/www/m/yushan/ra-liebiao-icon-deco.png) no-repeat;
|
|
background-size: 100% 100%;
|
|
margin-right: 35upx;
|
|
}
|
|
.title1 .xingji {
|
|
width: 44upx;
|
|
height: 32upx;
|
|
background: url(https://ys.tour-ma.com/r/cms/www/m/yushan/ra-liebiao-icon-deco1.png) no-repeat;
|
|
background-size: 100% 100%;
|
|
font-size: 20upx;
|
|
text-align: center;
|
|
color: #fff;
|
|
margin-left: 20upx;
|
|
padding: 0upx 5upx;
|
|
}
|
|
.title1 .price {
|
|
color: #ff0000;
|
|
display: flex;
|
|
align-items: baseline;
|
|
margin-left: auto;
|
|
margin-right: 20upx;
|
|
}
|
|
.title1 .price .rmb{
|
|
font-size: 20upx;
|
|
}
|
|
.title1 .price .pricenum{
|
|
font-size: 40upx;
|
|
}
|
|
.liboxbot .title2 {
|
|
margin-bottom: 35rpx;
|
|
padding: 0 20rpx 0 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.title2 .address{
|
|
color: #808080;
|
|
width: 100%;
|
|
}
|
|
.title2 .distancediv{
|
|
color: #808080;
|
|
width: 25%;
|
|
text-align: right;
|
|
}
|
|
.title2 .address::before {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 26upx;
|
|
height: 26upx;
|
|
background: url(https://ys.tour-ma.com/r/cms/www/m/yushan/ra-liebiao-icon-dizhi.png) no-repeat;
|
|
background-size: 100% 100%;
|
|
margin-right: 10upx;
|
|
}
|
|
.litxtimg {width: 30upx;height: 30upx;float: right;}
|
|
</style>
|
|
|