Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 4ffeb10f 作者: 方治民
操作

feat: 首页、农场、服务页面金刚区菜单支持页面跳转，页面滚动到指定位置

上级 3239e7e2
正在显示 包含 137 行增加 和 23 行删除
src/pages/fuwu/fuwu.vue
......@@ -2,11 +2,13 @@
import { reactive } from 'vue'
import { onLoad, onPullDownRefresh } from '@dcloudio/uni-app'
import * as NongzhiAPI from '@/api/model/nongzhi'
import * as HomeAPI from '@/api/model/home'
import Navigate from '@/utils/page/navigate'
// 下拉刷新
onPullDownRefresh(() => {
getGoodsList()
getServiceItems()
setTimeout(function () {
uni.stopPullDownRefresh()
Message.toast('刷新成功')
......@@ -14,6 +16,7 @@
})
onLoad(() => {
getGoodsList()
getServiceItems()
})
// 页面数据
......@@ -32,11 +35,36 @@
// 功能菜单
menuItems: [
{ id: 1, name: '灵活用工', icon: '/static/images/codefun/8193a279dfd933588d29a34aa2aeefe7.png' },
{ id: 2, name: '助农金融', icon: '/static/images/codefun/b4ac84c6c037b7ab92fa371141ad88e0.png' },
{ id: 3, name: '农资交易', icon: '/static/images/codefun/1ec00e65ad474de76b9efc3691acbbd1.png' },
{ id: 4, name: '农机服务', icon: '/static/images/codefun/d6d66fa5331d2be60c7b0b66de6477e5.png' },
{ id: 5, name: '更多', icon: '/static/images/codefun/aeaf23bed23b217a39c0c82cffb1bfb5.png' },
{
id: 1,
name: '灵活用工',
icon_url: '/static/images/codefun/8193a279dfd933588d29a34aa2aeefe7.png',
jump_target: '',
},
{
id: 2,
name: '助农金融',
icon_url: '/static/images/codefun/b4ac84c6c037b7ab92fa371141ad88e0.png',
jump_target: '',
},
{
id: 3,
name: '农资交易',
icon_url: '/static/images/codefun/1ec00e65ad474de76b9efc3691acbbd1.png',
jump_target: '',
},
{
id: 4,
name: '农机服务',
icon_url: '/static/images/codefun/d6d66fa5331d2be60c7b0b66de6477e5.png',
jump_target: '',
},
{
id: 5,
name: '更多',
icon_url: '/static/images/codefun/aeaf23bed23b217a39c0c82cffb1bfb5.png',
jump_target: '',
},
],
// 灵活用工业务
......@@ -231,10 +259,62 @@
})
}
// 查询服务列表
function getServiceItems() {
HomeAPI.zoneList({
pageNo: 1,
pageSize: 4,
status: 1,
type: 3,
}).then((res) => {
const { records } = res
pageData.menuItems = [...records].concat([
{
id: 5,
name: '更多',
icon_url: '/static/images/codefun/aeaf23bed23b217a39c0c82cffb1bfb5.png',
jump_target: '',
},
])
})
}
// 菜单点击事件
function onMenuItemClick(item: any) {
console.log('点击菜单项:', item)
// 在这里添加具体的菜单点击逻辑
if (item.jump_target?.startsWith('/')) {
const tabbarKeyWords = [
'/pages/shouye/shouye',
'/pages/nongchang/nongchang',
'/pages/fuwu/fuwu',
'/pages/chanxiao/chanxiao',
]
if (tabbarKeyWords.includes(item.jump_target)) {
uni.switchTab({
url: item.jump_target,
})
} else {
Navigate.to(item.jump_target).catch(() => {
Message.alert(`${item.jump_target} 页面打开失败`, item.name)
})
}
} else if (item.jump_target?.startsWith('http')) {
Navigate.webview(item.jump_target, item.name)
} else {
if (item.jump_target?.startsWith('#')) {
uni.pageScrollTo({
scrollTop: Number(item.jump_target?.substring(1) || 0),
duration: 300,
})
} else {
uni.showModal({
title: item.name,
content: '功能暂未开放',
})
}
}
}
// 查看更多灵活用工业务
......@@ -330,19 +410,19 @@
</view>
<view class="codefun-flex-row equal-division section_3 codefun-mt-12">
<view
v-for="item in pageData.menuItems"
v-for="(item, index) in pageData.menuItems"
:key="item.id"
class="codefun-flex-col codefun-items-center"
:class="{
'equal-division-item_1': item.id === 1,
'equal-division-item_2 equal-division-item': item.id === 2,
'equal-division-item_2 group_34': item.id === 3,
'equal-division-item_9 group_35': item.id === 4,
'equal-division-item_10 group_1': item.id === 5,
'equal-division-item_1': index === 0,
'equal-division-item_2 equal-division-item': index === 1,
'equal-division-item_2 group_34': index === 2,
'equal-division-item_9 group_35': index === 3,
'equal-division-item_10 group_1': index === 4,
}"
@click="onMenuItemClick(item)"
>
<image class="image_7" :src="item.icon" />
<image class="image_7" :src="item.icon_url" />
<text class="font_4" :class="`text_${item.id + 2} mt-13`">{{ item.name }}</text>
</view>
</view>
......
src/pages/nongchang/nongchang.vue
......@@ -19,7 +19,6 @@
getCommonToolsList()
// 农技课堂
getAgricultureClassList()
pageData.userInfo = userStore.getUserInfo
})
// 下拉刷新
......@@ -40,11 +39,11 @@
// 功能菜单
menuItems: [
// { id: 1, name: '监测预警', icon: '/static/images/codefun/e683f9d10dc21da45abffbfa4c56fffb.png' },
// { id: 2, name: '农业模型', icon: '/static/images/codefun/afdf5cf91bb1832ec12b89ba1f8a4a22.png' },
// { id: 3, name: '基地管理', icon: '/static/images/codefun/8ce0f7de048a5d10fd901fa4caee40fd.png' },
// { id: 4, name: '信用中心', icon: '/static/images/codefun/bc6853d7f464c445f1d6cc5f3b37103d.png' },
// { id: 5, name: '灵活用工', icon: '/static/images/codefun/104cbc5dca418b07e6933d2e953db1d8.png' },
{ id: 1, name: '监测预警', icon_url: '/static/images/codefun/e683f9d10dc21da45abffbfa4c56fffb.png' },
{ id: 2, name: '农业模型', icon_url: '/static/images/codefun/afdf5cf91bb1832ec12b89ba1f8a4a22.png' },
{ id: 3, name: '基地管理', icon_url: '/static/images/codefun/8ce0f7de048a5d10fd901fa4caee40fd.png' },
{ id: 4, name: '信用中心', icon_url: '/static/images/codefun/bc6853d7f464c445f1d6cc5f3b37103d.png' },
{ id: 5, name: '灵活用工', icon_url: '/static/images/codefun/104cbc5dca418b07e6933d2e953db1d8.png' },
],
// 农场信息
......@@ -231,7 +230,6 @@
type: 2,
}).then((res) => {
const { records } = res
pageData.menuItems = []
pageData.menuItems = records
})
}
......@@ -278,9 +276,38 @@
function onMenuItemClick(item: any) {
console.log('点击菜单项:', item)
// 在这里添加具体的菜单点击逻辑+
uni.reLaunch({
if (item.jump_target?.startsWith('/')) {
const tabbarKeyWords = [
'/pages/shouye/shouye',
'/pages/nongchang/nongchang',
'/pages/fuwu/fuwu',
'/pages/chanxiao/chanxiao',
]
if (tabbarKeyWords.includes(item.jump_target)) {
uni.switchTab({
url: item.jump_target,
})
} else {
Navigate.to(item.jump_target).catch(() => {
Message.alert(`${item.jump_target} 页面打开失败`, item.name)
})
}
} else if (item.jump_target?.startsWith('http')) {
Navigate.webview(item.jump_target, item.name)
} else {
if (item.jump_target?.startsWith('#')) {
uni.pageScrollTo({
scrollTop: Number(item.jump_target?.substring(1) || 0),
duration: 300,
})
} else {
uni.showModal({
title: item.name,
content: '功能暂未开放',
})
}
}
}
// 农业模型点击事件
......@@ -730,7 +757,7 @@
>
<image class="image_15" :src="pageData.creditCenter.image" />
<view class="codefun-flex-col codefun-items-start group_29">
<text class="text_62">{{ pageData.userInfo.creditScore }}</text>
<text class="text_62">{{ userStore.getUserInfo?.creditScore || 600 }}</text>
<text class="font_5 text_63 mt-13">{{ pageData.creditCenter.rating }}</text>
<text class="font_10 text_64 mt-13">{{ pageData.creditCenter.tips }}</text>
<view
......
src/pages/shouye/shouye.vue
......@@ -382,12 +382,19 @@
} else if (item.jump_target?.startsWith('http')) {
Navigate.webview(item.jump_target, item.name)
} else {
if (item.jump_target?.startsWith('#')) {
uni.pageScrollTo({
scrollTop: Number(item.jump_target?.substring(1) || 0),
duration: 300,
})
} else {
uni.showModal({
title: item.name,
content: '功能开发中...',
content: '功能暂未开放',
})
}
}
}
// 农产品关注点击事件
function onProductFollowClick(product: any) {
......@@ -778,7 +785,7 @@
</view>
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_19">
<text class="font_6 text_32">农技课堂</text>
<!-- <text class="font_7 text_33" @click="onViewMoreClass">查看全部</text> -->
<text class="font_7 text_33" @click="onViewMoreClass">查看全部</text>
</view>
<view class="codefun-flex-col section_13 !relative">
<fui-swiper-dot
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论