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.
632 lines
17 KiB
632 lines
17 KiB
<template>
|
|
<view class="wanl-list youquan">
|
|
<!-- 导航条 -->
|
|
<view class="cu-custom" :style="{height:height + 'px' }">
|
|
<view class="cu-bar bg-bgcolor fixed" :style="{ height: height + 'px', paddingTop: top + 'px'}">
|
|
<!-- 1.1.9 升级 其他页面进入 -->
|
|
<view v-if="pagesNum > 1" class="action" @tap="$wanlshop.back(1)"><text class="wlIcon-fanhui1"></text></view>
|
|
<!-- 直接进入 -->
|
|
<view v-else class="action" @tap="$wanlshop.on('/pages/index')"><text class="wlIcon-zhuye"></text></view>
|
|
|
|
<view class="search-form round" @tap="search()">
|
|
<text class="wlIcon-sousuo1 text-bold"></text>
|
|
<!-- <view class="searchinfo cu-tag round" v-if="category">
|
|
<text>类目:{{ category }}</text>
|
|
<text class="wlIcon-shanchu2"></text>
|
|
</view>
|
|
<view class="searchinfo cu-tag round text-df" v-else-if="params.search">
|
|
<text>{{ params.search }}</text>
|
|
<text class="wlIcon-shanchu2"></text>
|
|
</view> -->
|
|
<view>搜索商品</view>
|
|
</view>
|
|
<view class="action">
|
|
<image src="../static/images/img/fabu.png" mode="" @tap="$wanlshop.on('/pages/apps/find/user/add')"></image>
|
|
<image src="../static/images/img/user.png" style="margin-left:34rpx;" mode="" @tap="$wanlshop.on('/pages/apps/find/user')"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="conentContainer">
|
|
<image src="../static/images/img/youquan.png" mode="aspectFill" class="topPic"></image>
|
|
<view class="list" v-for="(item,index) in 6" :key="index">
|
|
<view class="title">
|
|
<view class="left">
|
|
<image src="../static/images/img/u1.png" mode=""></image>
|
|
<view class="name">
|
|
<text>清清之家</text>
|
|
<text class="time">2024-10-30</text>
|
|
</view>
|
|
</view>
|
|
<view class="right" v-if="index==1">
|
|
<image src="../static/images/img/dui.png" mode=""></image>
|
|
<text>已关注</text>
|
|
</view>
|
|
<view class="rightactive" v-else>
|
|
<image src="../static/images/img/jia.png" mode=""></image>
|
|
<text>关注</text>
|
|
</view>
|
|
</view>
|
|
<view class="topic">
|
|
美国奥数队总教练罗博深讲解《如何学好数学》完整版美国奥数队总教练罗博深讲解《如何学好数学》完整版
|
|
</view>
|
|
<view class="pic">
|
|
<image src="../static/images/img/youquan.png" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="toolBox">
|
|
<view class="toolItem">
|
|
<image src="../static/images/img/fenx.png" mode="widthFix"></image>
|
|
<text>568</text>
|
|
</view>
|
|
<view class="toolItem">
|
|
<image src="../static/images/img/xiaoxi.png" mode="widthFix"></image>
|
|
<text>568</text>
|
|
</view>
|
|
<view class="toolItem">
|
|
<image src="../static/images/img/dianzan.png" mode="widthFix"></image>
|
|
<text>568</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
// WanlScroll: 0, //记录页面滚动
|
|
// scrollStype: false, //滚动状态
|
|
// filterIndex: 0, //
|
|
// priceOrder: 0, //1 价格从低到高 2价格从高到低
|
|
// liststyle: 'col-2-20', //列表样式
|
|
// goodsData: [], //商品列表数据
|
|
// showRight: false,
|
|
// category: '',
|
|
// goodsType: 'goods',
|
|
// empty: '没有找到任何宝贝',
|
|
// params: {
|
|
// search: '',
|
|
// sort: 'weigh',
|
|
// order: 'asc',
|
|
// page: 1,
|
|
// filter: {},
|
|
// op: {}
|
|
// },
|
|
// likeData: [],
|
|
// drawerType: {
|
|
// attribute: false,
|
|
// first: false,
|
|
// city: false
|
|
// },
|
|
// drawerData: {
|
|
// price: {
|
|
// low: '',
|
|
// high: ''
|
|
// },
|
|
// brand: [],
|
|
// attribute: [],
|
|
// sameCity: {
|
|
// name: ' 定位中..',
|
|
// choice: false
|
|
// },
|
|
// city: [
|
|
// { name: '北京', choice: false },
|
|
// { name: '天津', choice: false },
|
|
// { name: '河北', choice: false },
|
|
// { name: '山西', choice: false },
|
|
// { name: '内蒙古', choice: false },
|
|
// { name: '山东', choice: false },
|
|
// { name: '江苏', choice: false },
|
|
// { name: '上海', choice: false },
|
|
// { name: '浙江', choice: false },
|
|
// { name: '安徽', choice: false },
|
|
// { name: '福建', choice: false },
|
|
// { name: '江西', choice: false },
|
|
// { name: '河南', choice: false },
|
|
// { name: '湖南', choice: false },
|
|
// { name: '湖北', choice: false },
|
|
// { name: '广东', choice: false },
|
|
// { name: '广西', choice: false },
|
|
// { name: '海南', choice: false },
|
|
// { name: '辽宁', choice: false },
|
|
// { name: '吉林', choice: false },
|
|
// { name: '黑龙江', choice: false },
|
|
// { name: '四川', choice: false },
|
|
// { name: '贵州', choice: false },
|
|
// { name: '云南', choice: false },
|
|
// { name: '重庆', choice: false },
|
|
// { name: '宁夏', choice: false },
|
|
// { name: '青海', choice: false },
|
|
// { name: '陕西', choice: false },
|
|
// { name: '甘肃', choice: false },
|
|
// { name: '新疆', choice: false },
|
|
// { name: '西藏', choice: false },
|
|
// { name: '香港', choice: false },
|
|
// { name: '澳门', choice: false },
|
|
// { name: '台湾', choice: false }
|
|
// ]
|
|
// },
|
|
// drawerParams: {},
|
|
// reload: false, //判断是否上拉
|
|
// last_page: 0,
|
|
// status: 'loading',
|
|
// contentText: {
|
|
// contentdown: '',
|
|
// contentrefresh: '正在加载..',
|
|
// contentnomore: '没有更多数据了'
|
|
// },
|
|
pagesNum: 0,
|
|
height:0,
|
|
top:0,
|
|
};
|
|
},
|
|
onLoad(option) {
|
|
this.pagesNum = getCurrentPages().length; // 1.1.9 升级
|
|
console.log(this.$wanlshop.wanlsys())
|
|
this.height = this.$wanlshop.wanlsys().height
|
|
this.top = this.$wanlshop.wanlsys().top
|
|
// if (option.type) {
|
|
// this.goodsType = option.type;
|
|
// }
|
|
// if (option.search) {
|
|
// //如果搜索存在
|
|
// this.params.search = option.search;
|
|
// this.drawerParams.search = option.search;
|
|
// } else if (option.data) {
|
|
// var data = JSON.parse(option.data);
|
|
// this.drawerParams.category_id = data.category_id;
|
|
// this.category = data.category_name;
|
|
// this.params.filter.category_id = data.category_id;
|
|
// this.params.op.category_id = 'in';
|
|
// } else {
|
|
// console.log('调试模式');
|
|
// }
|
|
// // 加载位置，后续版本开启加载写入全局
|
|
// uni.getLocation({
|
|
// type: 'wgs84',
|
|
// geocode: true,
|
|
// success: mres=> {
|
|
// uni.request({
|
|
// url: 'https://restapi.amap.com/v3/geocode/regeo',
|
|
// data: {
|
|
// key: this.$wanlshop.config('amapkey'),
|
|
// location: mres.longitude+','+mres.latitude
|
|
// },
|
|
// // 1.1.8升级
|
|
// success: res=> {
|
|
// if(res.res.infocode == '10000'){
|
|
// let address = res.data.regeocode.addressComponent;
|
|
// this.drawerData.sameCity.name = address.province;
|
|
// }else{
|
|
// this.$wanlshop.msg('获取位置失败：错误' + res.res.info);
|
|
// }
|
|
// }
|
|
// });
|
|
// }
|
|
// });
|
|
// this.loadData();
|
|
// if (this.goodsData.length == 0) {
|
|
// this.loadlikeData();
|
|
// }
|
|
},
|
|
// 监听上拉
|
|
// onPullDownRefresh() {
|
|
// this.params.page = 1;
|
|
// this.reload = true;
|
|
// this.loadData();
|
|
// },
|
|
// 下拉刷新
|
|
// onReachBottom() {
|
|
// if (this.params.page >= this.last_page) {
|
|
// this.status = 'noMore';
|
|
// } else {
|
|
// this.reload = false;
|
|
// this.contentText.contentdown = '上拉显示更多';
|
|
// this.params.page = this.params.page + 1; //页码+1
|
|
// this.status = 'loading';
|
|
// this.loadData();
|
|
// }
|
|
// },
|
|
// 监听滚动
|
|
// onPageScroll(object) {
|
|
// if (object.scrollTop > this.WanlScroll) {
|
|
// this.scrollStype = false;
|
|
// } else {
|
|
// this.scrollStype = true;
|
|
// }
|
|
// if (object.scrollTop < 0) {
|
|
// this.scrollStype = false;
|
|
// }
|
|
// this.WanlScroll = object.scrollTop;
|
|
// },
|
|
// 监听返回
|
|
// onUnload() {
|
|
// if (this.showRight) {
|
|
// this.closeDrawer();
|
|
// return true;
|
|
// }
|
|
// },
|
|
methods: {
|
|
//异步加载商品列表
|
|
// async loadData() {
|
|
// this.params.type = this.goodsType;
|
|
// await uni.request({
|
|
// url: '/wanlshop/product/lists',
|
|
// data: this.params,
|
|
// success: res => {
|
|
// uni.stopPullDownRefresh();
|
|
// this.status = 'more';
|
|
// this.goodsData = this.reload ? res.data.data : this.goodsData.concat(res.data.data); //数据 追加
|
|
// if(res.data.data.length == 0){
|
|
// this.empty = `没找到与“${this.category}${this.params.search}"相关的宝贝`;
|
|
// }
|
|
// this.params.page = res.data.current_page; //当前页码
|
|
// this.last_page = res.data.last_page; //总页码
|
|
// }
|
|
// });
|
|
// },
|
|
// // 滚动底部加载猜你喜欢
|
|
// async loadlikeData() {
|
|
// await uni.request({
|
|
// url: `/wanlshop/product/likes?pages=${this.goodsType}`,
|
|
// success: res => {
|
|
// this.likeData = res.data.data; //评论数据 追加
|
|
// }
|
|
// });
|
|
// },
|
|
// // 加载侧边栏数据
|
|
// async loadDrawer() {
|
|
// this.drawerParams.type = this.goodsType;
|
|
// await uni.request({
|
|
// url: '/wanlshop/product/drawer',
|
|
// data: this.drawerParams,
|
|
// success: res => {
|
|
// var brand = [],
|
|
// attribute = [];
|
|
// if(res.data.brand){
|
|
// res.data.brand.forEach(item => {
|
|
// var brandData = {
|
|
// id: item.id,
|
|
// name: item.name,
|
|
// fold: false, // 展开
|
|
// choice: false
|
|
// };
|
|
// brand.push(brandData);
|
|
// });
|
|
// }
|
|
// if(res.data.attribute){
|
|
// res.data.attribute.forEach(item => {
|
|
// var value = [];
|
|
// item.value.forEach(vo => {
|
|
// var valueData = {
|
|
// name: vo.name,
|
|
// choice: false
|
|
// };
|
|
// value.push(valueData);
|
|
// });
|
|
// var attributeData = {
|
|
// name: item.name,
|
|
// value: value,
|
|
// fold: false
|
|
// };
|
|
// attribute.push(attributeData);
|
|
// });
|
|
// }
|
|
// this.drawerData.brand = brand;
|
|
// this.drawerData.attribute = attribute;
|
|
// }
|
|
// });
|
|
// },
|
|
// //筛选点击
|
|
// tabClick(index) {
|
|
// if (this.filterIndex === index && index !== 3) {
|
|
// return;
|
|
// }
|
|
// this.filterIndex = index;
|
|
// if (index === 3) {
|
|
// this.priceOrder = this.priceOrder === 1 ? 2 : 1;
|
|
// } else {
|
|
// this.priceOrder = 0;
|
|
// }
|
|
|
|
// // 排序方式
|
|
// if (index === 0) {
|
|
// this.params.sort = 'weigh';
|
|
// this.params.order = 'desc';
|
|
// }
|
|
// if (index === 1) {
|
|
// this.params.sort = 'sales';
|
|
// this.params.order = 'desc';
|
|
// }
|
|
// if (index === 2) {
|
|
// this.params.sort = 'createtime';
|
|
// this.params.order = 'desc';
|
|
// }
|
|
// if (index === 3 && this.priceOrder === 1) {
|
|
// this.params.sort = 'price';
|
|
// this.params.order = 'desc';
|
|
// }
|
|
// if (index === 3 && this.priceOrder === 2) {
|
|
// this.params.sort = 'price';
|
|
// this.params.order = 'asc';
|
|
// }
|
|
// this.status = 'loading';
|
|
// this.params.page = 1;
|
|
// this.reload = true;
|
|
// this.loadData();
|
|
// uni.pageScrollTo({
|
|
// duration: 300,
|
|
// scrollTop: 0
|
|
// });
|
|
// },
|
|
// // 打开抽屉，并且加载品牌和类目属性
|
|
// showDrawer() {
|
|
// this.showRight = true;
|
|
// if (!this.drawerType.first) {
|
|
// this.loadDrawer();
|
|
// this.drawerType.first = true;
|
|
// }
|
|
// },
|
|
// // 点击抽屉
|
|
// onDraver(e) {
|
|
// var index = e.currentTarget.dataset.attribute,
|
|
// key = e.currentTarget.dataset.key;
|
|
// if (key == 'brand' || key == 'city') {
|
|
// // 取消所有选项,选中下面
|
|
// this.drawerData[key].forEach((item, keys) => {
|
|
// keys != index ? (item.choice = false) : '';
|
|
// });
|
|
// // 取消同城
|
|
// this.drawerData.sameCity.choice = false;
|
|
// this.drawerData[key][index].choice = !this.drawerData[key][index].choice;
|
|
// } else if (key == 'sameCity') {
|
|
// // 取消所有城市选项
|
|
// this.drawerData.city.forEach(item => {
|
|
// item.choice = false;
|
|
// });
|
|
// this.drawerData.sameCity.choice = !this.drawerData.sameCity.choice;
|
|
// } else {
|
|
// // 取消所有选项,选中下面
|
|
// this.drawerData.attribute[index].value.forEach((item, keys) => {
|
|
// keys != key ? (item.choice = false) : '';
|
|
// });
|
|
// this.drawerData.attribute[index].value[key].choice = !this.drawerData.attribute[index].value[key].choice;
|
|
// }
|
|
// },
|
|
// // 提交抽屉
|
|
// onDrawerTo() {
|
|
// // 查询价格
|
|
// if (this.drawerData.price.low != '' && this.drawerData.price.high != '') {
|
|
// this.params.filter.price = this.drawerData.price.low + ',' + this.drawerData.price.high;
|
|
// this.params.op.price = 'BETWEEN';
|
|
// } else {
|
|
// delete this.params.filter.price;
|
|
// delete this.params.op.price;
|
|
// }
|
|
// // 查询地址
|
|
// var cityData = '';
|
|
// this.drawerData.city.forEach(item => {
|
|
// if (item.choice) {
|
|
// cityData = item.name;
|
|
// }
|
|
// });
|
|
// if (cityData) {
|
|
// this.params.filter['shop.city'] = '%' + cityData + '%';
|
|
// this.params.op['shop.city'] = 'LIKE';
|
|
// } else if (this.drawerData.sameCity.choice) {
|
|
// this.params.filter['shop.city'] = this.drawerData.sameCity.name;
|
|
// this.params.op['shop.city'] = 'LIKE';
|
|
// } else {
|
|
// delete this.params.filter['shop.city'];
|
|
// delete this.params.op['shop.city'];
|
|
// }
|
|
// // 查询品牌
|
|
// var brandData = '';
|
|
// this.drawerData.brand.forEach(item => {
|
|
// if (item.choice) {
|
|
// brandData = item.id;
|
|
// }
|
|
// });
|
|
// if (brandData) {
|
|
// this.params.filter.brand_id = brandData;
|
|
// this.params.op.brand_id = '=';
|
|
// } else {
|
|
// delete this.params.filter.brand_id;
|
|
// delete this.params.op.brand_id;
|
|
// }
|
|
// // 查询属性
|
|
// var attributeData = [];
|
|
// this.drawerData.attribute.forEach((item, index) => {
|
|
// // item.name
|
|
// item.value.forEach((vo, index) => {
|
|
// if (vo.choice) {
|
|
// attributeData.push('%' + vo.name + '%');
|
|
// }
|
|
// });
|
|
// });
|
|
// // 1.0.8升级 有此项无法查询
|
|
// if (attributeData.length > 0) {
|
|
// this.params.filter.category_attribute = attributeData.join(',');
|
|
// this.params.op.category_attribute = 'LIKE';
|
|
// } else {
|
|
// delete this.params.filter.category_attribute;
|
|
// delete this.params.op.category_attribute;
|
|
// }
|
|
// this.status = 'loading';
|
|
// // 1.0.8升级
|
|
// this.goodsData = [];
|
|
// this.params.page = 1;
|
|
// this.reload = true;
|
|
// this.loadData();
|
|
// this.closeDrawer();
|
|
// },
|
|
// // 重置抽屉
|
|
// onDrawerReset() {
|
|
// this.drawerData.city.forEach(item => {
|
|
// item.choice = false;
|
|
// });
|
|
// this.drawerData.sameCity.choice = false;
|
|
// this.loadDrawer();
|
|
// },
|
|
// // 点击抽屉标题
|
|
// onDraverTitle(e) {
|
|
// var stype = e.currentTarget.dataset.key;
|
|
// if (stype === 'city') {
|
|
// this.drawerType[stype] = !this.drawerType[stype];
|
|
// } else {
|
|
// this.drawerData.attribute[stype].fold = !this.drawerData.attribute[stype].fold;
|
|
// }
|
|
// },
|
|
|
|
search() {
|
|
this.$wanlshop.to(`/pages/page/search?type=${this.goodsType}`,'fade-in',100);
|
|
},
|
|
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.youquan{
|
|
background-color: #F2F3F4;
|
|
height: calc(100vh);
|
|
overflow: auto;
|
|
.action{
|
|
&>image{
|
|
width: 44rpx;
|
|
height: 44rpx;
|
|
}
|
|
}
|
|
.conentContainer{
|
|
.topPic{
|
|
width:100%;
|
|
height:330rpx;
|
|
}
|
|
.list{
|
|
background: #fff;
|
|
margin: 20rpx 24rpx;
|
|
border-radius: 20rpx;
|
|
padding: 30rpx;
|
|
.title{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
.left{
|
|
display: flex;
|
|
align-items: center;
|
|
&>image{
|
|
width: 70rpx;
|
|
height: 70rpx;
|
|
border-radius: 50%;
|
|
}
|
|
.name{
|
|
margin-left:16rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
text{
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
|
|
}
|
|
.time{
|
|
margin-top:15rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 22rpx;
|
|
color: #666666;
|
|
}
|
|
}
|
|
}
|
|
.right{
|
|
padding:14rpx;
|
|
background: #E8E8E8;
|
|
border-radius: 25px;
|
|
display: flex;
|
|
align-items: center;
|
|
&>image{
|
|
width:19rpx;
|
|
height:13rpx;
|
|
}
|
|
&>text{
|
|
margin-left:7rpx;
|
|
font-family: Source Han Sans SC;
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
.rightactive{
|
|
display: flex;
|
|
align-items: center;
|
|
padding:14rpx;
|
|
background: #EB6100;
|
|
border-radius: 25px;
|
|
&>image{
|
|
width:18rpx;
|
|
height:18rpx;
|
|
}
|
|
&>text{
|
|
margin-left:7rpx;
|
|
font-family: Source Han Sans SC;
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
}
|
|
.topic{
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
color: #333333;
|
|
margin-top:27rpx;
|
|
|
|
}
|
|
.pic{
|
|
width:100%;
|
|
height: 330rpx;
|
|
background: #999999;
|
|
border-radius: 20rpx;
|
|
border: 1px solid #EAEAEA;
|
|
overflow: hidden;
|
|
margin-top:20rpx;
|
|
&>image{
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
}
|
|
.toolBox{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top:20rpx;
|
|
padding: 0 20rpx;
|
|
.toolItem{
|
|
display: flex;
|
|
align-items: center;
|
|
&>image{
|
|
width: 28rpx;
|
|
height:auto;
|
|
}
|
|
&>text{
|
|
margin-left:13rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
color: #222222;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.cu-custom .search-form{
|
|
border: 3rpx solid #fe6600;
|
|
background-color: #fff;
|
|
}
|
|
.cu-tag:not([class*="bg"]):not([class*="line"]){
|
|
background-color: #f7f7f7;
|
|
}
|
|
</style>
|
|
|