Commit 24086d61 authored by 彭佳妮(贵阳日报)'s avatar 彭佳妮(贵阳日报)
parents 38ea628d 64882a0c
<template>
<view class="sort" :style="{ width: width }">
<view class="date">出发日期</view>
<ul class="ul">
<li
v-for="(item, index) in items"
......@@ -30,6 +31,8 @@ const selectItem = (selectItem) => {
<style lang="scss" scoped>
.sort {
width: 710rpx;
height: 192rpx;
position: absolute;
top: 100%;
// width: 100%;
......@@ -39,19 +42,47 @@ const selectItem = (selectItem) => {
box-shadow: 0rpx 16rpx 16rpx 0rpx rgba(73, 73, 73, 0.14);
margin: 0 auto;
z-index: 99;
display: flex;
// display: flex;
padding-bottom: 20rpx;
box-sizing: border-box;
overflow: auto;
.date {
width: 96rpx;
height: 28rpx;
font-family: Source Han Sans;
font-size: 24rpx;
font-weight: normal;
line-height: 28rpx;
letter-spacing: 0em;
font-variation-settings: 'opsz' auto;
font-feature-settings: 'kern' on;
color: #fa5151;
margin-left: 44rpx;
margin-top: 20rpx;
}
.ul {
padding-left: 60rpx;
padding-left: 20rpx;
display: flex;
flex-flow: wrap;
li {
width: 154rpx;
height: 20rpx;
border-radius: 8rpx;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 6rpx 26rpx;
margin-left: 20rpx;
background: #f3f3f3;
font-size: 24rpx;
line-height: 20rpx;
text-align: center;
list-style-type: none;
font-size: 22rpx;
color: #3d3d3d;
margin-top: 20rpx;
}
.active {
color: #fa5151;
background: #feeeee;
}
}
}
......
<template>
<view class="sort" :style="{ width: width }">
<view class="date">景点</view>
<ul class="ul">
<li
v-for="(item, index) in items"
......@@ -15,7 +16,19 @@
<script setup>
import { defineProps } from 'vue';
const items = reactive(['智能排序', '距离优先', '好评优先', '销量优先', '低价优先', '低价优先']);
const items = reactive([
'智能排序',
'距离优先',
'好评优先',
'销量优先',
'低价优先',
'低价优先',
'距离优先',
'好评优先',
'销量优先',
'低价优先',
'距离优先',
]);
const selectedItem = ref(null);
const props = defineProps({
width: {
......@@ -30,6 +43,8 @@ const selectItem = (selectItem) => {
<style lang="scss" scoped>
.sort {
width: 710rpx;
height: 192rpx;
position: absolute;
top: 100%;
// width: 100%;
......@@ -39,19 +54,47 @@ const selectItem = (selectItem) => {
box-shadow: 0rpx 16rpx 16rpx 0rpx rgba(73, 73, 73, 0.14);
margin: 0 auto;
z-index: 99;
display: flex;
// display: flex;
padding-bottom: 20rpx;
box-sizing: border-box;
overflow: auto;
.date {
width: 96rpx;
height: 28rpx;
font-family: Source Han Sans;
font-size: 24rpx;
font-weight: normal;
line-height: 28rpx;
letter-spacing: 0em;
font-variation-settings: 'opsz' auto;
font-feature-settings: 'kern' on;
color: #fa5151;
margin-left: 44rpx;
margin-top: 20rpx;
}
.ul {
padding-left: 60rpx;
padding-left: 20rpx;
display: flex;
flex-flow: wrap;
li {
width: 154rpx;
height: 20rpx;
border-radius: 8rpx;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 6rpx 26rpx;
margin-left: 20rpx;
background: #f3f3f3;
font-size: 24rpx;
line-height: 20rpx;
text-align: center;
list-style-type: none;
font-size: 22rpx;
color: #3d3d3d;
margin-top: 20rpx;
}
.active {
color: #fa5151;
background: #feeeee;
}
}
}
......
<template>
<view class="sort" :style="{ width: width }">
<view class="date">筛选</view>
<ul class="ul">
<li
v-for="(item, index) in items"
......@@ -15,7 +16,19 @@
<script setup>
import { defineProps } from 'vue';
const items = reactive(['智能排序', '距离优先', '好评优先', '销量优先', '低价优先', '低价优先']);
const items = reactive([
'智能排序',
'距离优先',
'好评优先',
'销量优先',
'低价优先',
'低价优先',
'距离优先',
'好评优先',
'销量优先',
'低价优先',
'距离优先',
]);
const selectedItem = ref(null);
const props = defineProps({
width: {
......@@ -30,6 +43,8 @@ const selectItem = (selectItem) => {
<style lang="scss" scoped>
.sort {
width: 710rpx;
height: 192rpx;
position: absolute;
top: 100%;
// width: 100%;
......@@ -39,19 +54,47 @@ const selectItem = (selectItem) => {
box-shadow: 0rpx 16rpx 16rpx 0rpx rgba(73, 73, 73, 0.14);
margin: 0 auto;
z-index: 99;
display: flex;
// display: flex;
padding-bottom: 20rpx;
box-sizing: border-box;
overflow: auto;
.date {
width: 96rpx;
height: 28rpx;
font-family: Source Han Sans;
font-size: 24rpx;
font-weight: normal;
line-height: 28rpx;
letter-spacing: 0em;
font-variation-settings: 'opsz' auto;
font-feature-settings: 'kern' on;
color: #fa5151;
margin-left: 44rpx;
margin-top: 20rpx;
}
.ul {
padding-left: 60rpx;
padding-left: 20rpx;
display: flex;
flex-flow: wrap;
li {
width: 154rpx;
height: 20rpx;
border-radius: 8rpx;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 6rpx 26rpx;
margin-left: 20rpx;
background: #f3f3f3;
font-size: 24rpx;
line-height: 20rpx;
text-align: center;
list-style-type: none;
font-size: 22rpx;
color: #3d3d3d;
margin-top: 20rpx;
}
.active {
color: #fa5151;
background: #FEEEEE;
}
}
}
......
import { request } from '../../utils/request';
// 获取指定类型轮播图
export function getSortList(data) {
return request({
url: `/sgyrdd/category/znList`,
method: 'GET',
data,
});
}
// 筑农严选首页-分类预售商品列表
export function getPresaleCategory(data) {
return request({
url: `/sgyrdd/znprod/getPresaleCategoryProd`,
method: 'GET',
data,
});
}
// 预售板块轮播图
export function getPresaleList(data) {
return request({
url: `/sgyrdd/carousel/presaleList`,
method: 'GET',
data,
});
}
// 筑农严选分类
export function getStrictSelection(data) {
return request({
url: `/sgyrdd/category/getZnyx`,
method: 'GET',
data,
});
}
// 筑农预售分类
export function getBuindingSort(data) {
return request({
url: `/sgyrdd/category/presaleList`,
method: 'GET',
data,
});
}
<template>
<div class="route-details">
<scroll-view class="container" scroll-y>
<img class="back-img" src="/static/assistingAgriculture/assets/left.png" @tap="back" />
<!-- 轮播 -->
<div class="banner">
<!-- -->
......@@ -60,7 +61,7 @@
<span>/5分</span>
</p>
</div>
<div class="link">查看全部(526) ></div>
<div class="link" @click="toCommentDetail">查看全部(526) ></div>
</div>
<div class="tags">
<p>景色优美 (153)</p>
......@@ -78,7 +79,7 @@
<div class="album">
<div class="top flex-between">
<div class="title">用户相册</div>
<div class="link">查看全部(526) ></div>
<div class="link" @click="toAlbum">查看全部(526) ></div>
</div>
<div class="img-list">
<wd-img
......@@ -268,6 +269,26 @@ const swiperList = ref([
'https://registry.npmmirror.com/wot-design-uni-assets/*/files/moon.jpg',
'https://registry.npmmirror.com/wot-design-uni-assets/*/files/meng.jpg',
]);
// 返回上一级
function back() {
xma.navigateBack({
delta: 1,
});
}
// 跳转详情页
function toCommentDetail() {
// TODO: 跳转到评论详情页
xma.navigateTo({
url: '/pages/assistingAgriculture/commentList/index',
});
}
// 跳转用户相册
function toAlbum() {
// TODO: 跳转到评论详情页
xma.navigateTo({
url: '/pages/assistingAgriculture/album/index',
});
}
</script>
<style lang="scss" scoped>
uni-page-body {
......@@ -677,4 +698,12 @@ uni-page-body {
}
}
}
.back-img {
width: 56rpx;
height: 56rpx;
position: absolute;
z-index: 999;
margin-top: 40rpx;
margin-left: 40rpx;
}
</style>
......@@ -26,46 +26,16 @@
</view>
<view class="sort">
<view style="display: flex; flex-direction: row">
<view class="borderClass" @tap="toBuilding">
<img
src="/static/assistingAgriculture/assets/buildingAgriculture.png"
style="width: 96rpx; height: 96rpx"
/>
<view class="sort-text">筑农严选</view>
</view>
<view class="borderClass">
<img
src="/static/assistingAgriculture/assets/adoption.png"
style="width: 96rpx; height: 96rpx"
/>
<view class="sort-text">认养农业</view>
</view>
<view class="borderClass" @tap="toRuralTravel">
<img
src="/static/assistingAgriculture/assets/rural.png"
style="width: 96rpx; height: 96rpx"
/>
<view class="sort-text">乡村旅居</view>
</view>
<view class="borderClass">
<img
src="/static/assistingAgriculture/assets/buildingAgriculture.png"
style="width: 96rpx; height: 96rpx"
/>
<view class="sort-text">特色农庄</view>
<view
class="borderClass"
@click="toBuilding(index)"
v-for="(item, index) in sortList"
:key="index"
>
<img :src="item.icon" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">{{ item.categoryName }}</view>
</view>
</view>
<!-- <view style="display: flex; flex-direction: row">-->
<!-- <view-->
<!-- class="borderClass"-->
<!-- @tap="toBuilding"-->
<!-- v-for="(item, index) in sortList"-->
<!-- :key="index"-->
<!-- >-->
<!-- <img :src="item.img" style="width: 96rpx; height: 96rpx" />-->
<!-- <view class="sort-text">{{ item.text }}</view>-->
<!-- </view>-->
<!-- </view>-->
</view>
<view class="product-page">
<view>
......@@ -181,10 +151,15 @@
<script setup lang="ts">
import Search from '../../../components/assistingAgriculture/index/Search.vue';
import {
getPresaleCategory,
getSortList,
getStrictSelection,
} from '../../../api/assistingAgriculture/building';
import { onMounted } from 'vue';
const list = ref([
// { img: '/static/assistingAgriculture/assets/mainPicture.png', text: '特色美食' },
// { img: '/static/assistingAgriculture/assets/presale.png', text: '农货预售' },
// // { img: '/static/assistingAgriculture/assets/mainPicture.png', text: '特色美食' },
// // { img: '/static/assistingAgriculture/assets/presale.png', text: '农货预售' },
{ img: '/static/assistingAgriculture/assets/mainPicture.png', text: '乡村非遗' },
{ img: '/static/assistingAgriculture/assets/mainPicture.png', text: '认养农业' },
{ img: '/static/assistingAgriculture/assets/mainPicture.png', text: '乡村旅居' },
......@@ -207,31 +182,49 @@ const detailList = ref([
text: '麻辣鱼豆腐',
},
]);
const sortList = ref([
{
img: '/static/assistingAgriculture/assets/buildingAgriculture.png',
price: '25',
text: '筑农严选',
},
{ img: '/static/assistingAgriculture/assets/adoption.png', price: '25', text: '认养农业' },
{ img: '/static/assistingAgriculture/assets/rural.png', price: '25', text: '乡村旅居' },
{
img: '/static/assistingAgriculture/assets/buildingAgriculture.png',
price: '25',
text: '特色农庄',
},
]);
function toBuilding() {
// TODO: 跳转到筑农严选
xma.navigateTo({
url: '/pages/assistingAgriculture/index/building',
const sortList = ref([]);
onMounted(async () => {
getList();
getPresaleCategoryList();
getStrictSelectionList();
});
// 获取筑农专区分类;
const getList = () => {
getSortList().then((res) => {
console.log(res, 111);
res.data.forEach((item) => {
item.icon = import.meta.env.VITE_APP_IMG_URL + item.icon;
item.pic = import.meta.env.VITE_APP_IMG_URL + item.pic;
});
sortList.value = res.data;
console.log(list.value, 111);
});
}
function toRuralTravel() {
// TODO: 跳转到乡村旅居
xma.navigateTo({
url: '/pages/assistingAgriculture/RuralTravel/RuralTravel',
};
// 筑农严选首页-分类预售商品列表
const getPresaleCategoryList = () => {
getPresaleCategory().then((res) => {
console.log(res, 222);
});
};
// 筑农严选分类
const getStrictSelectionList = () => {
getStrictSelection().then((res) => {
console.log(res, 333);
});
};
function toBuilding(index) {
if (index === 0) {
// TODO: 跳转到筑农严选
xma.navigateTo({
url: '/pages/assistingAgriculture/index/building',
});
} else if (index === 2) {
// TODO: 跳转到乡村旅居
xma.navigateTo({
url: '/pages/assistingAgriculture/RuralTravel/RuralTravel',
});
}
console.log(index, 121);
}
// 跳转详情页
function toDetail() {
......
......@@ -152,7 +152,12 @@
<script setup>
import Search from '../../../components/assistingAgriculture/index/Search.vue';
import { ref } from 'vue';
import { ref, onMounted } from 'vue';
import {
getBuindingSort,
getPresaleList,
getStrictSelection,
} from '../../../api/assistingAgriculture/building';
const current = ref(0);
const light = ref(0);
const sortList = ref([
......@@ -238,6 +243,22 @@ const goodList = ref([
price: 69.9,
},
]);
onMounted(async () => {
getPresale();
getBuindingSortList();
});
// 预售板块轮播图
const getPresale = () => {
getPresaleList({ place: 3 }).then((res) => {
console.log(res, 111);
});
};
// 筑农预售分类
const getBuindingSortList = () => {
getBuindingSort({ level: 3 }).then((res) => {
console.log(res, 222);
});
};
// 左侧数据列表
const LeftList = ref([]);
// 右侧数据列表
......
......@@ -138,7 +138,7 @@ onLoad((option) => {
const { parentId, pic, categoryName } = option;
categoryNames.value = categoryName;
categoryId.value = parentId;
params.value.categoryId = [parentId];
params.value.categoryIds = [parentId];
pics.value = pic;
query(parentId);
prodSpecialFn();
......
......@@ -141,18 +141,18 @@
<view class="bz">
<text class="yh-name">保障:</text>
<view class="icon-box">
<i class="iconfont icon icon-rs-countdown" />
<image src="@/static/shop/icon-1.png" class="m-r"></image>
过期退
</view>
<view style="margin-left: 64rpx" class="icon-box">
<i class="iconfont icon icon-ic_business_refund24px" />
<image src="@/static/shop/icon-2.png" class="m-r"></image>
随时退
</view>
<view style="margin-left: 64rpx" class="icon-box">
<i class="iconfont icon icon-naozhong" />
<image src="@/static/shop/icon-3.png" class="m-r"></image>
随时用
</view>
<i @click="alert" class="iconfont jg icon-jinggao" />
<image style="margin-left: auto" @click="alert" src="@/static/shop/icon-4.png"></image>
</view>
<view class="xz">
<text class="yh-name">限制:</text>
......@@ -255,6 +255,7 @@
<script setup>
import { getProdDetail, getCollect, getCouponShopList, receiveCoupon } from '@/api/packageDetail';
import { getStoreInformation } from '@/api/shop';
import { getDistance } from '@/utils/common';
const prodInfo = ref({});
const prodRlue = ref({});
const myProdId = ref('');
......@@ -263,7 +264,7 @@ const showRlue = ref(true);
const imgUrl = import.meta.env.VITE_APP_IMG_URL;
const shopInfo = ref({});
const show = ref(false);
const currentLatitudeAndLongitude = ref({});
const shopLocation = ref({});
const shopId = ref('');
const showpopup = ref(false);
const prodSkusInfo = ref({});
......@@ -273,17 +274,21 @@ onLoad((options) => {
const { prodId } = options;
myProdId.value = prodId;
getProdDetailFn(prodId).then((shopId) => {
getStoreInformationFn(shopId);
getStoreInformationFn(shopId).then((shopInfo) => {
// 获取位置
getLocationFn();
});
getCouponShopListFn(prodId, shopId);
});
});
onShow(() => {
// 获取位置
getLocationFn();
});
function alert() {
if (productCoupons.value.length > 0) {
show.value = true;
} else {
xma.showToast({
title: '暂无优惠券',
icon: 'error',
});
}
}
/**
......@@ -391,8 +396,9 @@ function getLocationFn() {
xma.getLocation({
type: 'wgs84',
success: function (res) {
const myLatitude = currentLatitudeAndLongitude.value.latitude;
const myLongitude = currentLatitudeAndLongitude.value.longitude;
const myLatitude = shopLocation.value.latitude;
const myLongitude = shopLocation.value.longitude;
console.log('myLongitude', myLatitude, myLongitude);
const distance = getDistance(res.latitude, res.longitude, myLatitude, myLongitude, 1);
shopInfo.value.distance = distance;
},
......@@ -425,9 +431,11 @@ const getStoreInformationFn = (id) => {
getStoreInformation(id).then((res) => {
if (res.code === 0) {
shopInfo.value = res.data.shop;
shopInfo.value.tagList = res.data.shop.labels.split(',');
currentLatitudeAndLongitude.value.latitude = res.data.shop.location.lat;
currentLatitudeAndLongitude.value.longitude = res.data.shop.location.lon;
if (res.data.shop.labels) {
shopInfo.value.tagList = res.data.shop.labels.split(',');
}
shopLocation.value.latitude = res.data.shop.location.lat;
shopLocation.value.longitude = res.data.shop.location.lon;
resolve();
}
});
......@@ -850,24 +858,19 @@ page {
display: flex;
align-items: center;
margin: 22rpx 0 32rpx 0;
image {
width: 14 * 2rpx;
height: 14 * 2rpx;
}
.icon-box {
display: flex;
align-items: center;
font-size: 11 * 2rpx;
color: #abaaaa;
.icon {
font-size: 38rpx;
font-weight: bold;
font-weight: 300;
color: #fa5151;
.m-r {
margin-right: 10rpx;
}
}
.jg {
font-size: 46rpx;
font-weight: bold;
margin-left: auto;
color: #abaaaa;
}
}
.xz {
font-size: 10 * 2rpx;
......
......@@ -46,6 +46,7 @@
</view>
<view class="score-icon">
<wd-rate
custom-class="icon-statr"
color="#fff"
readonly
v-model="shopInfo.grade"
......@@ -128,9 +129,10 @@
<text class="goods-title multi-line">{{ item.prodName }}</text>
<text class="yh-fl multi-line">{{ item.brief }}</text>
<text class="yh-time multi-line">{{ item.rule }}</text>
<view class="tag-list">
<view class="tag">{{ item.labelNames }}</view>
<!-- <view class="tag">随时退</view> -->
<view class="tag-list" v-if="item.labelNames.length > 0">
<view v-for="(lab, i) in item.labelNames" :key="i">
<text v-if="lab" class="tag" style="border-radius: 6rpx">{{ lab }}</text>
</view>
</view>
<view class="price">
<text class="num0">到手</text>
......@@ -180,6 +182,7 @@
<view class="u-pf">
<text>{{ item.descriptionMatches }}</text>
<wd-rate
custom-class="icon-statr"
color="#fff"
readonly
v-model="item.descriptionMatches"
......@@ -557,6 +560,9 @@ const groupBuyListFn = (shopId) => {
if (res.code === 0) {
listOfGroupBuyingProducts.value = res.data.map((item) => {
item.pic = imgUrl + item.pic;
item.labelNames = item.labelNames.split(',').filter((lab) => {
return lab !== '';
});
return item;
});
}
......@@ -887,6 +893,11 @@ page {
margin-left: 8rpx;
}
}
.icon-statr {
:v-deep(.wd-rate__item-star--active) {
overflow: visible !important;
}
}
}
.shop-business-hours {
texe {
......@@ -1106,7 +1117,7 @@ page {
background: #fcdbdb;
padding: 2rpx 8rpx;
box-sizing: border-box;
font-size: 8 * 2rpx;
font-size: 12 * 2rpx;
color: #fa5151;
margin-right: 8rpx;
}
......@@ -1206,6 +1217,11 @@ page {
.u-pf {
display: flex;
align-items: center;
.icon-statr {
:v-deep(.wd-rate__item-star--active) {
overflow: visible !important;
}
}
text {
color: #fa5151;
font-weight: 700;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment