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.
659 lines
16 KiB
659 lines
16 KiB
import http from '../../utils/api'
|
|
|
|
// pages/market/market.js
|
|
Page({
|
|
data: {
|
|
// 当前时间
|
|
currentTime: '',
|
|
|
|
// 销售市场数据
|
|
salesData: [],
|
|
salesUpdateTime: '',
|
|
salesStatus: 'inactive',
|
|
|
|
// 饲料市场数据
|
|
feedData: [],
|
|
feedUpdateTime: '',
|
|
feedStatus: 'inactive',
|
|
|
|
// 市场趋势数据
|
|
trendData: [],
|
|
unreadCount: 0,
|
|
|
|
// 最后更新时间
|
|
lastUpdateTime: '',
|
|
|
|
// 刷新状态
|
|
isRefreshing: false,
|
|
|
|
// 动画数据
|
|
headerAnimation: {},
|
|
cardAnimation1: {},
|
|
cardAnimation2: {},
|
|
cardAnimation3: {},
|
|
|
|
// 无缝滚动相关数据
|
|
scrollOffset: 0, // 滚动偏移量
|
|
scrollDuration: 0.5, // 滚动动画持续时间
|
|
scrollTimer: null, // 滚动定时器
|
|
itemHeight: 150, // 每个公告项的高度（估算值，单位：px）
|
|
isPaused: false // 是否暂停滚动
|
|
},
|
|
|
|
onLoad: function () {
|
|
// 初始化时间
|
|
this.updateCurrentTime();
|
|
|
|
// 初始化数据
|
|
this.initMarketData();
|
|
|
|
// 启动动画
|
|
this.startPageAnimations();
|
|
|
|
// 启动定时器
|
|
this.startTimers();
|
|
|
|
// 启动无缝滚动
|
|
this.startAutoScroll();
|
|
this.getsales()
|
|
this.getfeed()
|
|
this.gettrend()
|
|
},
|
|
|
|
onShow: function () {
|
|
// 恢复滚动（如果之前暂停了）
|
|
if (this.data.isPaused) {
|
|
this.setData({
|
|
isPaused: false
|
|
});
|
|
this.startAutoScroll();
|
|
}
|
|
},
|
|
|
|
onHide: function () {
|
|
// 页面隐藏时暂停滚动
|
|
this.stopAutoScroll();
|
|
this.setData({
|
|
isPaused: true
|
|
});
|
|
},
|
|
|
|
onUnload: function () {
|
|
// 清理定时器
|
|
this.clearTimers();
|
|
// 停止滚动
|
|
this.stopAutoScroll();
|
|
},
|
|
|
|
|
|
// 销售市场
|
|
getsales() {
|
|
http.sales({
|
|
data: {},
|
|
success: res => {
|
|
console.log(11, res);
|
|
this.setData({
|
|
salesData:res.rows
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
//饲料市场
|
|
getfeed() {
|
|
http.feed({
|
|
data: {},
|
|
success: res => {
|
|
console.log(22, res);
|
|
this.setData({
|
|
feedData:res.rows
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
// 市场趋势
|
|
gettrend() {
|
|
http.trend({
|
|
data: {},
|
|
success: res => {
|
|
console.log(22, res);
|
|
this.setData({
|
|
trendData:res.rows
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
onPullDownRefresh: function () {
|
|
this.refreshAllData();
|
|
},
|
|
|
|
// 更新当前时间
|
|
updateCurrentTime: function () {
|
|
const now = new Date();
|
|
const timeStr = `${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
this.setData({
|
|
currentTime: timeStr
|
|
});
|
|
},
|
|
|
|
// 启动定时器
|
|
startTimers: function () {
|
|
// 更新时间
|
|
this.timeTimer = setInterval(() => {
|
|
this.updateCurrentTime();
|
|
}, 60000);
|
|
|
|
// 模拟实时数据更新
|
|
this.dataTimer = setInterval(() => {
|
|
this.updateRandomData();
|
|
}, 30000);
|
|
},
|
|
|
|
// 清理定时器
|
|
clearTimers: function () {
|
|
if (this.timeTimer) clearInterval(this.timeTimer);
|
|
if (this.dataTimer) clearInterval(this.dataTimer);
|
|
},
|
|
|
|
// 启动自动滚动
|
|
startAutoScroll: function () {
|
|
// 清除已有的定时器
|
|
if (this.data.scrollTimer) {
|
|
clearInterval(this.data.scrollTimer);
|
|
}
|
|
|
|
// 计算总高度（一条数据的高度 * 数据条数）
|
|
const totalHeight = this.data.itemHeight * this.data.trendData.length;
|
|
|
|
// 设置滚动定时器，每5秒滚动一次
|
|
const scrollTimer = setInterval(() => {
|
|
this.autoScrollStep(totalHeight);
|
|
}, 5000);
|
|
|
|
this.setData({
|
|
scrollTimer
|
|
});
|
|
},
|
|
|
|
// 停止自动滚动
|
|
stopAutoScroll: function () {
|
|
if (this.data.scrollTimer) {
|
|
clearInterval(this.data.scrollTimer);
|
|
this.setData({
|
|
scrollTimer: null
|
|
});
|
|
}
|
|
},
|
|
|
|
// 自动滚动步骤
|
|
autoScrollStep: function (totalHeight) {
|
|
// 计算下一个偏移量
|
|
let nextOffset = this.data.scrollOffset + this.data.itemHeight;
|
|
|
|
// 如果滚动到了第一组数据的末尾，重置到开始位置
|
|
if (nextOffset >= totalHeight) {
|
|
// 瞬间回到起点，然后继续滚动
|
|
this.setData({
|
|
scrollOffset: 0,
|
|
scrollDuration: 0
|
|
});
|
|
|
|
// 下一帧继续正常滚动
|
|
setTimeout(() => {
|
|
this.setData({
|
|
scrollOffset: this.data.itemHeight,
|
|
scrollDuration: 0.5
|
|
});
|
|
}, 50);
|
|
} else {
|
|
// 正常滚动
|
|
this.setData({
|
|
scrollOffset: nextOffset,
|
|
scrollDuration: 0.5
|
|
});
|
|
}
|
|
},
|
|
|
|
// 手动控制滚动（可选）
|
|
pauseScroll: function () {
|
|
this.stopAutoScroll();
|
|
this.setData({
|
|
isPaused: true
|
|
});
|
|
},
|
|
|
|
resumeScroll: function () {
|
|
if (this.data.isPaused) {
|
|
this.setData({
|
|
isPaused: false
|
|
});
|
|
this.startAutoScroll();
|
|
}
|
|
},
|
|
|
|
// 初始化市场数据
|
|
initMarketData: function () {
|
|
// 模拟销售市场数据（6条数据）
|
|
const salesData = [{
|
|
id: 1,
|
|
name: '优质肉牛',
|
|
region: '内蒙古呼伦贝尔',
|
|
price: 35.8,
|
|
unit: '公斤',
|
|
trend: 'up',
|
|
change: '+2.3%',
|
|
updateTime: '09:30'
|
|
},
|
|
{
|
|
id: 2,
|
|
name: '绵羊',
|
|
region: '新疆阿勒泰',
|
|
price: 28.5,
|
|
unit: '公斤',
|
|
trend: 'stable',
|
|
change: '0%',
|
|
updateTime: '09:25'
|
|
},
|
|
{
|
|
id: 3,
|
|
name: '山羊',
|
|
region: '山东济宁',
|
|
price: 32.2,
|
|
unit: '公斤',
|
|
trend: 'down',
|
|
change: '-1.5%',
|
|
updateTime: '09:20'
|
|
},
|
|
{
|
|
id: 4,
|
|
name: '奶牛',
|
|
region: '黑龙江',
|
|
price: 26.8,
|
|
unit: '公斤',
|
|
trend: 'up',
|
|
change: '+1.2%',
|
|
updateTime: '09:15'
|
|
},
|
|
{
|
|
id: 5,
|
|
name: '生猪',
|
|
region: '河南',
|
|
price: 18.5,
|
|
unit: '公斤',
|
|
trend: 'up',
|
|
change: '+3.1%',
|
|
updateTime: '09:10'
|
|
},
|
|
{
|
|
id: 6,
|
|
name: '肉羊',
|
|
region: '甘肃',
|
|
price: 30.2,
|
|
unit: '公斤',
|
|
trend: 'stable',
|
|
change: '0%',
|
|
updateTime: '09:05'
|
|
}
|
|
];
|
|
|
|
// 模拟饲料市场数据（5条数据）
|
|
const feedData = [{
|
|
id: 1,
|
|
name: '玉米饲料',
|
|
supplier: '内蒙古正大饲料有限公司',
|
|
price: 2.85,
|
|
unit: '公斤',
|
|
trend: 'up',
|
|
chartHeight: 85,
|
|
updateTime: '09:28'
|
|
},
|
|
{
|
|
id: 2,
|
|
name: '豆粕',
|
|
supplier: '山东六和集团股份有限公司',
|
|
price: 3.42,
|
|
unit: '公斤',
|
|
trend: 'up',
|
|
chartHeight: 92,
|
|
updateTime: '09:25'
|
|
},
|
|
{
|
|
id: 3,
|
|
name: '青贮饲料',
|
|
supplier: '河北牧原股份有限责任公司',
|
|
price: 0.78,
|
|
unit: '公斤',
|
|
trend: 'stable',
|
|
chartHeight: 65,
|
|
updateTime: '09:22'
|
|
},
|
|
{
|
|
id: 4,
|
|
name: '麦麸',
|
|
supplier: '河南双汇发展有限公司',
|
|
price: 1.25,
|
|
unit: '公斤',
|
|
trend: 'down',
|
|
chartHeight: 45,
|
|
updateTime: '09:20'
|
|
},
|
|
{
|
|
id: 5,
|
|
name: '鱼粉',
|
|
supplier: '广东海大集团',
|
|
price: 5.8,
|
|
unit: '公斤',
|
|
trend: 'stable',
|
|
chartHeight: 60,
|
|
updateTime: '09:18'
|
|
}
|
|
];
|
|
|
|
// 模拟市场趋势通知公告数据（8条数据）
|
|
const trendData = [{
|
|
id: 1,
|
|
type: 'report',
|
|
title: '2023年Q3畜牧业市场分析报告发布',
|
|
source: '国家统计局',
|
|
date: '2023-10-15',
|
|
summary: '第三季度畜产品价格整体上涨3.2%，饲料成本下降1.5%，养殖效益显著提升',
|
|
isNew: true,
|
|
isHot: true
|
|
},
|
|
{
|
|
id: 2,
|
|
type: 'prediction',
|
|
title: '专家预测：四季度牛肉价格将稳中有升',
|
|
source: '行业专家委员会',
|
|
date: '2023-10-12',
|
|
summary: '受季节因素影响，预计四季度牛肉价格上涨幅度在3-5%之间',
|
|
isNew: true,
|
|
isHot: false
|
|
},
|
|
{
|
|
id: 3,
|
|
type: 'report',
|
|
title: '全国饲料价格指数月报（9月份）',
|
|
source: '农业部监测中心',
|
|
date: '2023-10-10',
|
|
summary: '9月份全国饲料价格指数为108.5，环比上涨0.8%，同比上涨2.3%',
|
|
isNew: false,
|
|
isHot: true
|
|
},
|
|
{
|
|
id: 4,
|
|
type: 'prediction',
|
|
title: '冬季饲草供应紧张预警',
|
|
source: '气象局农业处',
|
|
date: '2023-10-08',
|
|
summary: '北方地区提前进入冬季，预计饲草储备量不足，价格可能上涨',
|
|
isNew: true,
|
|
isHot: true
|
|
},
|
|
{
|
|
id: 5,
|
|
type: 'report',
|
|
title: '牛羊养殖效益分析报告',
|
|
source: '畜牧业协会',
|
|
date: '2023-10-05',
|
|
summary: '2023年1-9月牛羊养殖效益同比增长8.5%，创近三年新高',
|
|
isNew: false,
|
|
isHot: false
|
|
},
|
|
{
|
|
id: 6,
|
|
type: 'report',
|
|
title: '畜产品质量安全监测报告',
|
|
source: '质量监督局',
|
|
date: '2023-10-03',
|
|
summary: '第三季度畜产品质量抽检合格率达99.2%，质量安全状况良好',
|
|
isNew: false,
|
|
isHot: false
|
|
},
|
|
{
|
|
id: 7,
|
|
type: 'prediction',
|
|
title: '明年饲料原料价格走势分析',
|
|
source: '农业经济研究所',
|
|
date: '2023-10-01',
|
|
summary: '预计明年玉米、豆粕等主要原料价格将保持稳定，波动幅度有限',
|
|
isNew: false,
|
|
isHot: false
|
|
},
|
|
{
|
|
id: 8,
|
|
type: 'report',
|
|
title: '畜牧业数字化转型进展报告',
|
|
source: '工信部',
|
|
date: '2023-09-28',
|
|
summary: '全国畜牧业数字化率已达45%，智能养殖设备普及率显著提升',
|
|
isNew: false,
|
|
isHot: true
|
|
}
|
|
];
|
|
|
|
// 计算未读数量
|
|
const unreadCount = trendData.filter(item => item.isNew).length;
|
|
|
|
const now = new Date();
|
|
const timeStr = `${now.getMonth()+1}月${now.getDate()}日 ${now.getHours()}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
const lastUpdateTime = `${now.getHours()}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
|
|
this.setData({
|
|
salesData,
|
|
feedData,
|
|
trendData,
|
|
unreadCount,
|
|
salesUpdateTime: timeStr,
|
|
feedUpdateTime: timeStr,
|
|
lastUpdateTime,
|
|
salesStatus: 'inactive',
|
|
feedStatus: 'inactive'
|
|
});
|
|
|
|
// 模拟数据加载完成
|
|
setTimeout(() => {
|
|
this.setData({
|
|
salesStatus: 'active',
|
|
feedStatus: 'active'
|
|
});
|
|
}, 1500);
|
|
},
|
|
|
|
// 启动页面动画
|
|
startPageAnimations: function () {
|
|
// 头部动画
|
|
const headerAnimation = wx.createAnimation({
|
|
duration: 800,
|
|
timingFunction: 'ease-out'
|
|
});
|
|
headerAnimation.translateY(0).opacity(1).step();
|
|
|
|
// 卡片动画
|
|
const cardAnimation1 = wx.createAnimation({
|
|
duration: 600,
|
|
timingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
delay: 200
|
|
});
|
|
cardAnimation1.translateY(0).opacity(1).step();
|
|
|
|
const cardAnimation2 = wx.createAnimation({
|
|
duration: 600,
|
|
timingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
delay: 350
|
|
});
|
|
cardAnimation2.translateY(0).opacity(1).step();
|
|
|
|
const cardAnimation3 = wx.createAnimation({
|
|
duration: 600,
|
|
timingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
delay: 500
|
|
});
|
|
cardAnimation3.translateY(0).opacity(1).step();
|
|
|
|
this.setData({
|
|
headerAnimation: headerAnimation.export(),
|
|
cardAnimation1: cardAnimation1.export(),
|
|
cardAnimation2: cardAnimation2.export(),
|
|
cardAnimation3: cardAnimation3.export()
|
|
});
|
|
},
|
|
|
|
// 刷新所有数据
|
|
refreshAllData: function () {
|
|
if (this.data.isRefreshing) return;
|
|
|
|
this.setData({
|
|
isRefreshing: true,
|
|
salesStatus: 'active',
|
|
feedStatus: 'active'
|
|
});
|
|
|
|
// 显示加载动画
|
|
wx.showLoading({
|
|
title: '更新数据中...',
|
|
mask: true
|
|
});
|
|
|
|
// 模拟网络请求
|
|
setTimeout(() => {
|
|
// 更新数据
|
|
this.updateRandomData();
|
|
|
|
// 更新时间戳
|
|
const now = new Date();
|
|
const timeStr = `${now.getMonth()+1}月${now.getDate()}日 ${now.getHours()}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
const lastUpdateTime = `${now.getHours()}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
|
|
this.setData({
|
|
salesUpdateTime: timeStr,
|
|
feedUpdateTime: timeStr,
|
|
lastUpdateTime,
|
|
isRefreshing: false,
|
|
salesStatus: 'inactive',
|
|
feedStatus: 'inactive'
|
|
});
|
|
|
|
// 显示成功提示
|
|
wx.hideLoading();
|
|
wx.showToast({
|
|
title: '数据已更新',
|
|
icon: 'success',
|
|
duration: 1500
|
|
});
|
|
|
|
// 停止下拉刷新
|
|
wx.stopPullDownRefresh();
|
|
}, 1500);
|
|
},
|
|
|
|
// 更新随机数据（模拟实时变化）
|
|
updateRandomData: function () {
|
|
// 随机更新销售价格
|
|
const updatedSalesData = this.data.salesData.map(item => {
|
|
const random = Math.random();
|
|
let newPrice, trend, change;
|
|
|
|
if (random < 0.4) {
|
|
// 上涨
|
|
trend = 'up';
|
|
change = +(Math.random() * 0.5 + 0.1).toFixed(1);
|
|
newPrice = +(item.price * (1 + change / 100)).toFixed(1);
|
|
} else if (random < 0.7) {
|
|
// 稳定
|
|
trend = 'stable';
|
|
change = 0;
|
|
newPrice = item.price;
|
|
} else {
|
|
// 下降
|
|
trend = 'down';
|
|
change = +(Math.random() * 0.5 + 0.1).toFixed(1);
|
|
newPrice = +(item.price * (1 - change / 100)).toFixed(1);
|
|
}
|
|
|
|
// 更新时间
|
|
const now = new Date();
|
|
const updateTime = `${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
|
|
return {
|
|
...item,
|
|
price: newPrice,
|
|
trend,
|
|
change: trend === 'stable' ? '0%' : (trend === 'up' ? `+${change}%` : `-${change}%`),
|
|
updateTime
|
|
};
|
|
});
|
|
|
|
// 随机更新饲料价格
|
|
const updatedFeedData = this.data.feedData.map(item => {
|
|
const random = Math.random();
|
|
let trend, chartHeight;
|
|
|
|
if (random < 0.4) {
|
|
trend = 'up';
|
|
chartHeight = Math.floor(Math.random() * 30 + 70);
|
|
} else if (random < 0.7) {
|
|
trend = 'stable';
|
|
chartHeight = Math.floor(Math.random() * 20 + 50);
|
|
} else {
|
|
trend = 'down';
|
|
chartHeight = Math.floor(Math.random() * 20 + 30);
|
|
}
|
|
|
|
// 轻微调整价格
|
|
const priceChange = (Math.random() - 0.5) * 0.1;
|
|
const newPrice = +(item.price + priceChange).toFixed(2);
|
|
|
|
// 更新时间
|
|
const now = new Date();
|
|
const updateTime = `${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
|
|
return {
|
|
...item,
|
|
price: newPrice > 0 ? newPrice : item.price,
|
|
trend,
|
|
chartHeight,
|
|
updateTime
|
|
};
|
|
});
|
|
|
|
// 随机更新趋势数据（标记一些为已读，添加新公告）
|
|
const updatedTrendData = [...this.data.trendData];
|
|
|
|
// 随机标记一些为已读
|
|
updatedTrendData.forEach((item, index) => {
|
|
if (item.isNew && Math.random() > 0.7) {
|
|
updatedTrendData[index] = {
|
|
...item,
|
|
isNew: false
|
|
};
|
|
}
|
|
});
|
|
|
|
// 偶尔添加新公告
|
|
if (Math.random() > 0.8) {
|
|
const newNotice = {
|
|
id: Date.now(),
|
|
type: Math.random() > 0.5 ? 'report' : 'prediction',
|
|
title: `实时快报：${Math.random() > 0.5 ? '价格波动提醒' : '行业动态更新'}`,
|
|
source: '实时监测系统',
|
|
date: new Date().toISOString().split('T')[0],
|
|
summary: '系统监测到市场出现新的变化，请关注后续详细分析',
|
|
isNew: true,
|
|
isHot: Math.random() > 0.7
|
|
};
|
|
updatedTrendData.unshift(newNotice);
|
|
}
|
|
|
|
const unreadCount = updatedTrendData.filter(item => item.isNew).length;
|
|
|
|
this.setData({
|
|
salesData: updatedSalesData,
|
|
feedData: updatedFeedData,
|
|
trendData: updatedTrendData,
|
|
unreadCount
|
|
});
|
|
}
|
|
});
|