Commit ca8a083b authored by 张娇(东信)'s avatar 张娇(东信)

筑农接口添加

parent a75a38c4
<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,
});
}
......@@ -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"
@tap="toBuilding"
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,20 +182,36 @@ 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: '特色农庄',
},
]);
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);
});
};
// 筑农严选首页-分类预售商品列表
const getPresaleCategoryList = () => {
getPresaleCategory().then((res) => {
console.log(res, 222);
});
};
// 筑农严选分类
const getStrictSelectionList = () => {
getStrictSelection().then((res) => {
console.log(res, 333);
});
};
function toBuilding() {
// TODO: 跳转到筑农严选
xma.navigateTo({
......
......@@ -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([]);
// 右侧数据列表
......
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