代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<title>掌上小鑫鑫-五金查询平台</title>
<meta name="description" content="掌上小鑫鑫(鑫鑫(www.xiaoxx.net)是专门)是专门为五金行业打造的信息化平台，操作简洁，一键式搜索。给客户提供五金类产品信息服务，在小鑫鑫平台上搜索五金产品，查看商家主营信息，一键拨打商家电话订货。为五金采购者提供商家信息对接。包括五金产品供应,五金产品采购,五金企业招商,五金配件等信息,是中国五金采购的必备掌上平台">
<meta name="keywords" content="五金,小鑫鑫,五金建材,五金批发,五金查询,五金工具,机械设备,日用五金,五金耗材,劳保用品,五金企业,五金采购">
<link rel="shortcut icon" sizes="16x16" href="./images/weixin/icon.jpg">
<script src="js/weixin/vue.js"></script>
<script src="js/weixin/mui.min.js"></script>
<script src="js/weixin/axios.min.js"></script>
<link rel="stylesheet" href="css/weixin/mui.min.css">
<link rel="stylesheet" type="text/css" href="css/weixin/style.css">
<style type="text/css">
#zhao {
min-height: 100%;
padding-bottom: 20px;
height: auto;
}
.pos {
position: initial;
width: 60%;
margin: 0 auto;
}
#tell_box {
display: none;
position: fixed;
bottom: -1px;
z-index: 99999999;
width: 100%;
background: #d8d8d8;
}
#tell_box h4 {
margin-bottom: 10px;
background: white;
text-align: center;
line-height: 40px;
margin-top: 0px;
}
.page_view {
z-index: 9;
}
#slider img {
height: 180px;
}
</style>
<script>
function imgError(image) {
app.sellerPicpath = null;
// 隐藏图片
// image.style.display = 'none';
// 替换为默认图片
// image.setAttribute("src","http://www.xiaoxx.net//gypupload/advertimage/20181114/77065b1d-cd40-46a1-b3c3-eaae9d3903d8.png");
}
</script>
</head>
<body bgcolor="#f4f4f4">
<div id="app" v-cloak>
<header class="mui-bar mui-bar-nav putong">
<h1 class="mui-title">"{{scopeName}}"的查询结果</h1>
<a class="mui-action-back mui-icon mui-icon-arrowleft" style="color:#fff;"></a>
</header>
<!-- <div class="mui-content"> -->
<!-- <div class="serch_list"> -->
<!--下拉刷新容器-->
<div id="pullrefresh" class="mui-content mui-scroll-wrapper serch_list" style="margin-bottom: 60px;">
<div class="mui-scroll">
<!--数据列表-->
<ul class="mui-table-view mui-table-view-chevron" style="background: none;">
<li v-for="value in arr">
<button class="li" :data-zi="value.id"></button>
<div class="gsxx">
<div v-if="value.sellerPhone.length===11 || value.sellerTel.length > 11">
<button class="tel" @click="tel(value.sellerPhone,value.sellerTel)"></button>
</div>
<div v-else>
<a class="null">此商户未留联系方式</a>
</div>
<h1 class="sj dian">
<img v-show="value.sellerType===1" src="images/weixin/vip.png" width="25" />
<span v-if="value.sellerType===1" class="vip">{{value.sellerName}}</span><span v-else>{{value.sellerName}}</span>
</h1>
<p class="dizhi dian">{{value.sellerAddr}}</p>
</div>
<div class="zhuying">
<button type="button" class="mui-btn">详情</button>
<span class="zy dian">主营：{{value.sellerScope}}</span>
</div>
</li>
<li style="padding: 20px;text-align: center;margin-top: 20px;" v-show="arr1=== 0">当前查询的"{{scopeName}}"没有找到对应的商户，请更换或减少关键字再试一下，商户信息持续更新中</li>
</ul>
</div>
</div>
<!---->
<!-- </div> -->
<!--结果列表end-->
<!-- </div> -->
<!--底部菜单end-->
<div id="tell_box">
<h4>请选择要拨打的号码</h4>
<ul class="mui-table-view">
<li v-if="num.length === 11" class="mui-table-view-cell" @click="call(num)">
<a class="mui-navigate-right">
手机：{{num}}
</a>
</li>
<li v-else class="mui-table-view-cell">
<a class="mui-navigate-right">
手机：空
</a>
</li>
<li v-if="num2 === null || num2.length < 11" class="mui-table-view-cell">
<a class="mui-navigate-right">
电话：空
</a>
</li>
<li v-else class="mui-table-view-cell" @click="call(num2)">
<a class="mui-navigate-right">
电话： {{num2}}
</a>
</li>
</ul>
</div>
</div>
</body>
<script type="text/javascript">
var shang = '';
var id = localStorage.getItem('ID');
mui.init({
pullRefresh: {
container: '#pullrefresh',
up: {
contentrefresh: '正在加载...',
contentnomore: "---我是有底线的---",
callback: pullupRefresh
}
}
});
var count = 2;
var mask = mui.createMask(disnone); //callback为用户点击蒙版时自动执行的回调；
function pullupRefresh() {
axios.get(URL + 'searchAction!searchSeller', {
params: {
scopeName: this.scopeName,
ye: count
}
})
.then(function(response) {
// console.log(response.data.data);
mui('#pullrefresh').pullRefresh().endPullupToRefresh(response.data.data.length === 0) //参数为true代表没有更多数据了。
var data1 = app.arr
var data2 = response.data.data
var data3 = data1.concat(data2);
app.arr = data3;
count++;
// gaoliang();
})
.catch(function(error) {
console.log(error);
});
}
var app = new Vue({
el: '#app',
data: {
scopeName: '焊丝',
arr: [],
he: [],
arr1: 1,
shouye: 0,
sellerClick: 12,
sellerName: "商家名称",
sellerAddr: "商家地址",
sellerScope: "商家主营产品/商家主营产品/商家主营产品",
sellerProfile: "商家简介商家简介商家简介商家简介商家简介商家简介商家简介商家简介商家简介商家简介商家简介",
sellerType: Number,
sellerPhone: "",
sellerTel: '',
marketAddr: '',
marketName: '',
num: '',
num2: '',
srcArr: [],
firstImg: '',
lastImg: ''
},
mounted: function() {
if(id !== null) {
// console.log(id)
this.shouye = 1;
// this.open(id);
// localStorage.removeItem('ID');
}
if(localStorage.getItem("KEY")) {
var key = localStorage.getItem("KEY");
this.scopeName = key;
localStorage.removeItem("KEY");
axios.get(URL + 'searchAction!searchSeller', {
params: {
scopeName: this.scopeName,
ye: 1
}
})
.then(function(response) {
app.arr = response.data.data;
setTimeout(function() {
// gaoliang()
}, 50)
console.log(JSON.stringify(app.arr))
if(app.arr.length === 0) {
app.arr1 = 0;
}
})
.catch(function(error) {
console.log(error);
});
}
},
methods: {
tel: function(num, num2) {
mask.show(); //显示遮罩
mui("#tell_box")[0].style.display = 'block';
mui(".mui-backdrop")[0].style.zIndex = '99999998';
app.num = num;
app.num2 = num2;
},
call: function(num) {
location.href = "tel:" + num;
mui("#tell_box")[0].style.display = 'none';
mask.close(); //关闭遮罩
},
none: function() {
document.querySelector("#zhao").style.display = 'none';
document.querySelector("footer").style.display = 'block';
},
// open:function(id) {
//
// mui.openWindow({
// url:'xiangqing.html',
// id:'xiangqing.html',
// });
// localStorage.setItem('ID',id);
// },
xiangxi: function(id) {
mui.ajax(URL + 'searchAction!findSellerById', {
data: {
id: id
},
dataType: 'json', //服务器返回json格式数据
type: 'post', //HTTP请求类型
timeout: 10000, //超时时间设置为10秒；
success: function(data) {
var getData = data.data[0].seller[0];
app.sellerClick = getData.sellerClick;
app.sellerAddr = getData.sellerAddr;
app.sellerName = getData.sellerName;
app.sellerScope = getData.sellerScope;
app.sellerProfile = getData.sellerProfile;
app.num = getData.sellerPhone;
app.num2 = getData.sellerTel;
app.sellerPicpath = getData.sellerPicpath1;
app.sellerType = getData.sellerType;
app.marketName = getData.marketName;
app.marketAddr = getData.marketAddr;
console.log(app.num.length, app.num2.length);
app.srcArr = data.data[0].sellerPic;
if(app.srcArr.length > 0) {
app.firstImg = app.srcArr[app.srcArr.length - 1].picPath;
app.lastImg = app.srcArr[0].picPath;
}
if(app.srcArr.length > 1) {
setTimeout(function() {
var gallery = mui('.mui-slider');
gallery.slider({
interval: 3000 //自动轮播周期，若为0则不自动播放，默认为0；
});
}, 200)
}
},
error: function(xhr, type, errorThrown) {
console.log(xhr)
}
});
}
}
})
mui("#pullrefresh").on('tap', '.li', function(event) {
console.log(11111111)
mui.openWindow({
url: 'xiangqing.html',
id: 'xiangqing.html',
});
localStorage.setItem('ID', this.getAttribute("data-zi"));
});
//
function disnone() {
mui("#tell_box")[0].style.display = 'none';
}
</script>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手