bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
历届学生/吴欣阳/项目开发/美食app/pages/bannerInfo/bannerInfo.vue Normal file
View File

@@ -0,0 +1,35 @@
<template>
<view>
<view class="top"></view>
<view class="content">
<image :src="urldata.banner"></image>
<view class="title">{{urldata.title}}</view>
<view class="content_list" v-html="urldata.content"></view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
urldata: {}
}
},
onLoad(option) {
this.getbannerInfo(option.url)
},
methods: {
async getbannerInfo(toulr) {
this.urldata = await this.$http.index.bannerInfo({
url: toulr
})
console.log("三餐", this.urldata)
},
}
}
</script>
<style lang="less" scoped>
@import "../../common/less/page/bannerinfo.less";
</style>

78
历届学生/吴欣阳/项目开发/美食app/pages/classification/classification.vue Normal file
View File

@@ -0,0 +1,78 @@
<template>
<view>
<view class="header">
<view class="search" @click="tosearch()">
<i class="iconfont">&#xe647</i>
<span>搜索百万免费菜谱</span>
</view>
</view>
<scroll-view class="left" scroll-y>
<view class="title" v-for="(v,i) in leftMenudata" :key="i" :class="{active:i==classname?isActive:!isActive}" @click="getright(v,i)">
<i class="aaa" :style="{'background-position-y':v.position*2-1+'rpx'}"
></i>
<span>{{v.title}}</span>
</view>
</scroll-view>
<view class="right" v-if="leftMenudata[classname]">
<view class="title_a" v-for="(v,i) in leftMenudata[classname].content" @click="torightMenuList(v)">
<image :src="v.img"></image>
<span class="">{{v.title}}</span>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
leftMenudata:[],
classname:0,//这个是下标
isActive:true,
}
},
async onLoad() {
await this.getleftMenu()
this.getrightMenudata()
},
methods: {
//TODO 第18行的判断有点看不懂去掉出bug，应该是渲染速度比数据请求快的问题 这个是判断它是否存在吗？
async getleftMenu() {
this.leftMenudata = await this.$http.index.leftMenu()
console.log("left",this.leftMenudata)
},
async getrightMenudata() {
if(this.leftMenudata[this.classname].content.length==0){
let res = await this.$http.index.rightMenu({
url:this.leftMenudata[this.classname].url
})
this.leftMenudata[this.classname].content.push(...res)
console.log("left",this.leftMenudata[this.classname].url)
}
},
getright(v,i){
console.log(v,i)
this.classname=i
this.getrightMenudata()
console.log("left",this.leftMenudata)
},
tosearch(){
uni.navigateTo({
url: '/pages/search/search'
})
},
torightMenuList(v){
uni.navigateTo({
url: '/pages/rightMenuList/rightMenuList?url='+v.id+'&title='+v.title
})
console.log(v)
}
}
}
</script>
<style lang="less" scoped>
@import "../../common/less/page/classification.less";
</style>

202
历届学生/吴欣阳/项目开发/美食app/pages/index/index.vue Normal file
View File

@@ -0,0 +1,202 @@
<template>
<view class="index">
<view class="header" @click="tosearch()">
<view class="search">
<i class="iconfont">&#xe647</i>
<span>搜索百万免费菜谱</span>
</view>
</view>
<view class="content">
<p class="title_a">今日热门</p>
<view class="uni-padding-wrap">
<view class="page-section swiper">
<view class="page-section-spacing">
<swiper class="swiper" :autoplay="autoplay" :circular="circular"
:indicator-dots="ind" indicator-color="rgba(0, 0, 0, .3)" indicator-active-color="#ffffff">
<swiper-item v-for="(v,i) in bannerdata" :key="i" @click="tobannerInfo(v.url)">
<image :src="v.img" class="banner"></image>
</swiper-item>
</swiper>
</view>
</view>
</view>
<p class="title_b">为你推荐</p>
<view class="top_tab">
<view class="tab">
<image src="../../static/img/W1.png">
<span>每日优惠</span>
</image>
</view>
<view class="tab_2" @click="goclass()">
<image src="../../static/img/W2.png">
<span>食材大全</span>
</image>
</view>
</view>
<view class="top_tab">
<view class="top_3">
<image src="../../static/img/W3.png">
<span>热门专题</span>
</image>
</view>
<view class="top_3" @click="goclass()">
<image src="../../static/img/W4.png">
<span>菜谱分类</span>
</image>
</view>
<view class="top_3" @click="govideo()">
<image src="../../static/img/W5.png">
<span>视频菜谱</span>
</image>
</view>
</view>
<view class="title_c">每日三餐</view>
<view class="threeMeals_top">
<view class="threeMeals_text" :class="{active:i==mealsnumber?isActive:!isActive}"
v-for="(v,i) in threeMeals" :key="i" @click="clickswitch(i)">{{ v.title }}
</view>
</view><!--顶部选项-->
<swiper class="swiper-box" @change="onswitch" :current="mealsnumber"><!--轮播图-->
<swiper-item class="swiper-item" v-for="(v,i) in threeMeals" :key="i">
<scroll-view scroll-y class="list_data_1">
<view class="list_data" v-for="(data,icon) in v.content" :key="icon" @click="toinfo(data.url)">
<image :src="data.img"></image>
<p>{{ data.title }}</p>
<view class="txt">养</view>
<view class="txt_2">{{ data.des }}</view>
</view>
</scroll-view>
</swiper-item>
</swiper>
<view class="title_d">大家都在做</view>
<view class="title_d_top">
<view v-for="(v,i) in type" class="title_d_top_text" @click="title_top_typs(i)" :class="{active_2:i==typenumber?isActive:!isActive}">{{ v.title }}</view>
</view>
<view class="title_d_content" v-for="(v,i) in type" v-show="typenumber==i">
<view class="title_d_content_list" v-for="(data,i) in type[typenumber].content" :key="i" @click="toinfo(data.path)">
<view v-if="isarray(data.img) == false">
<image :src="data.img" class="food_img"></image>
</view>
<view v-if="isarray(data.img) == true">
<image :src="data.img[0]" class="food_img"></image>
</view>
<p>{{data.title}}</p>
<view class="yyy">养</view>
<view class="dddd" v-if="data.label">{{data.label.desc}}</view>
<view class="user">
<view class="user_left">
<image :src="data.author.avatar_url" class="user_img"></image>
<span class="tit">{{data.author.nickname}}</span>
</view>
<view class="user_right">
<i class="iconfont sssss">&#xe8bf</i>
<span class="nubs">{{data.viewed_amount}}</span>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
type: [
{title: '推荐', type: 1, page: 1, total_page: 0, content: []},
{title: '时令', type: 2, page: 1, total_page: 0, content: []},
{title: '食肉', type: 3, page: 1, total_page: 0, content: []},
{title: '素食', type: 4, page: 1, total_page: 0, content: []},
{title: '烘焙', type: 5, page: 1, total_page: 0, content: []},
],
typenumber: 0,
autoplay: true,//轮播图
circular: true,//轮播图
interval: 3000,//轮播图
ind: true,//轮播图
mealsnumber: 0,//轮播图页数
bannerdata: [],//轮播图数据
threeMeals: [],//每日三擦数据
isActive: true,//判断显示active
};
},
onLoad() {
this.getbanner()//获取banner图
this.getthreeMeals()//获取每日三餐
this.getclassdata()
},
onReachBottom(){
this.type[this.typenumber].page = this.type[this.typenumber].page + 1
if (this.type[this.typenumber].page< this.type[this.typenumber].total_page) {
this.getclassdata()
}
},
methods: {
isarray:function(arraya){
var arr = arraya instanceof Array
return arr
},
async getbanner() {
this.bannerdata = await this.$http.index.banner()
console.log("轮播图", this.bannerdata)
},
async getthreeMeals() {
this.threeMeals = await this.$http.index.threeMeals()
console.log("三餐", this.threeMeals)
},
async getclassdata() {
if(this.type[this.typenumber].content.length==0){
let res = await this.$http.index.class({
type: this.type[this.typenumber].type,
page: this.type[this.typenumber].page
})
this.type[this.typenumber].total_page=res.total_page
this.type[this.typenumber].content.push(...res.items)
console.log("分类", this.type)
}
},
clickswitch(i) {
this.mealsnumber = i
},
onswitch(i) {
this.mealsnumber = i.detail.current
},
tobannerInfo(toulr) {
uni.navigateTo({
url: "/pages/bannerInfo/bannerInfo?url=" + toulr
})
},
goclass() {
uni.switchTab({
url: '/pages/classification/classification'
})
},
govideo() {
uni.switchTab({
url: '/pages/video/video'
})
},
tosearch() {
uni.navigateTo({
url: '/pages/search/search'
})
},
toinfo(v) {
console.log("======", v)
uni.navigateTo({
url: '/pages/info/info?url=' + v
})
},
title_top_typs(i) {
this.typenumber = i
this.getclassdata()
}
},
};
</script>
<style lang="less" scoped>
@import "../../common/less/page/Home.less";
</style>

130
历届学生/吴欣阳/项目开发/美食app/pages/info/info.vue Normal file
View File

@@ -0,0 +1,130 @@
<template>
<view class="pad">
<view class="top">
<i class="iconfont" @click="back()">&#xe601</i>
<image src="../../static/img/icon.png" @click="tohome()"></image>
<view class="search" @click="tosearch()">
<i class="iconfont">&#xe647</i>
<span>搜索百万菜谱</span>
</view>
<view class="sousuo" @click="tosearch()">搜索</view>
<view class="caipu" @click="totype()">菜谱大全</view>
</view>
<view class="content">
<image :src="data.backImg" class="back"></image>
<view class="content_1">
<view class="text">
<view class="text_1">{{ data.title }}</view>
<view class="posttime">{{ data.posttime }}</view>
<view class="list">
<view class="list_1" v-for="(v,i) in data.Statistics" :key="i">
<span>{{ v.title }}</span>
<view class="jdw">
<view class="jd" :style="v.proportion"></view>
</view>
</view>
</view>
<view class="tips">*tips: 中国居民每日推荐摄入营养所得占比数据</view>
<view class="cpargsw" v-if="data.stepInfo">
<view class="title_2" v-for="(v,i) in data.stepInfo.arr" :key="i">
<i :style="{'background-position-y':v.position*2+'rpx'}"></i>
<span>{{v.title}}</span>
</view>
</view>
<view v-if="data.stepInfo">
<view class="text_2" :class="onshou?'':'showdata'">
{{data.stepInfo.message}}
</view>
</view>
<view class="text_2_1" @click="show()">
<span>展开</span>
<i class="iconfont ssss" :class="onshou?'shang':'xia'">&#xe601</i>
</view>
<view class="text_3">主料</view>
<view class="text_3_1" v-if="data.material">
<view class="text_3_2" v-for="(v,i) in data.material.accessories" :key="i">
<view class="list_title">{{v.title}}</view>
<view class="list_nums">{{v.nums}}</view>
</view>
</view>
<view class="text_3">辅料</view>
<view class="text_3_1" v-if="data.material">
<view class="text_3_2" v-for="(v,i) in data.material.main" :key="i">
<view class="list_title">{{v.title}}</view>
<view class="list_nums">{{v.nums}}</view>
</view>
</view>
</view>
<view class="step">
<view v-for="(v,i) in data.DetailedSteps" :key="i">
<!--不是成品图的情况-->
<view v-if="!Array.isArray(v.step_img)">
<view class="step_list">
<!--是否是烹饪技巧，烹饪技巧没有图片，所以需要判断-->
<image mode="widthFix" :src="v.step_img" v-if="v.step_title!='烹饪技巧'"></image>
<span class="step_list_1">{{v.step_title}}</span>
</view>
<span class="title_0">{{v.step_text}}</span>
</view>
<!--是成品图的布局，你需要再写一套成品图的html布局-->
<view v-else>显示成品图</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
urls: '',
data: [],
onshou: false //控制显示隐藏
}
},
onLoad(option) {
this.urls = option.url
this.getinfo()
},
methods: {
async getinfo() {
this.data = await this.$http.index.info({
url: this.urls
})
console.log("left", this.data)
},
tosearch() {
uni.navigateTo({
url: '/pages/search/search'
})
},
tohome() {
uni.switchTab({
url: '/pages/index/index'
})
},
totype() {
uni.switchTab({
url: '/pages/classification/classification'
})
},
back() {
uni.navigateBack()
},
show() {
this.onshou = !this.onshou
}
},
}
</script>
<style lang="less" scoped>
@import "../../common/less/page/info.less";
</style>

24
历届学生/吴欣阳/项目开发/美食app/pages/me/me.vue Normal file
View File

@@ -0,0 +1,24 @@
<template>
<view class="threeMeals_top">
</view>
</template>
<script>
export default {
data() {
return {
};
},
onLoad() {
},
methods: {}
};
</script>
<style lang="less" scoped>
@import "../../common/less/page/Home.less";
</style>

97
历届学生/吴欣阳/项目开发/美食app/pages/rightMenuList/rightMenuList.vue Normal file
View File

@@ -0,0 +1,97 @@
<template>
<view class="pad">
<view class="top">
<image src="../../static/img/icon.png" @click="tohome()"></image>
<view class="search" @click="tosearch()">
<i class="iconfont">&#xe647</i>
<span>搜索百万菜谱</span>
</view>
<view class="sousuo" @click="tosearch()">搜索</view>
<view class="caipu" @click="totype()">菜谱大全</view>
</view>
<view class="content">
<view class="title">{{title}}做法T0P10</view>
<view class="list">
<view class="list_1" v-for="(v,i) in MenuList" :key="i" @click="toinfo(v.url)">
<image :src="v.img"></image>
<view class="text">
<p>{{v.title}}</p>
<view>
<image src="../../static/img/xx.png" class="xx"></image>
<image src="../../static/img/xx.png" class="xx"></image>
<image src="../../static/img/xx.png" class="xx"></image>
<image src="../../static/img/xx.png" class="xx"></image>
<image src="../../static/img/xx.png" class="xx"></image>
</view>
<view class="neb">
<image src="../../static/img/y.png"></image>
<span>{{v.like}}</span>
<image src="../../static/img/c.png"></image>
<span>{{v.view}}</span>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
urls: '',
title: '',
MenuList: [],
page: 0
}
},
onLoad(option) {
this.urls = option.url
this.title = option.title
this.getMenuList()
},
onReachBottom() {
this.page = this.page + 1
this.getMenuList()
},
methods: {
async getMenuList() {
let res = await this.$http.index.rightMenuList({
url: this.urls,
p: this.page
})
console.log("left", res)
this.MenuList = [
...this.MenuList,
...res
]
},
tosearch() {
uni.navigateTo({
url: '/pages/search/search'
})
},
tohome() {
uni.switchTab({
url: '/pages/index/index'
})
},
totype() {
uni.switchTab({
url: '/pages/classification/classification'
})
},
toinfo(v) {
uni.navigateTo({
url: '/pages/info/info?url=' + v
})
}
},
}
</script>
<style lang="less" scoped>
@import "../../common/less/page/rightM.less";
</style>

67
历届学生/吴欣阳/项目开发/美食app/pages/search/search.vue Normal file
View File

@@ -0,0 +1,67 @@
<template>
<view>
<view class="hader">
<i class="iconfont" @click="goback()">&#xe601</i>
<input type="text" placeholder="菜谱名,食材名" v-model="datalist" class="caipu">
<button class="ser" @click="getdata()">搜索</button>
</view>
<view class="list" v-if="Showhideo">
<view class="list_content" v-for="(v,i) in content" :key="i">
<img :src="v.img" alt="">
<view class="li_left">
<p class="top">{{v.title}}</p>
<p class="top_2">{{v.des}}</p>
</view>
</view>
</view>
<view class="neir" v-else>请输入搜索的内容</view>
<!--这里判断出问题了-->
</view>
</template>
<script>
export default {
data() {
return {
page: 1,
content: [],
datalist: null,
Showhideo: false, //文字显示隐藏 默认显示文字
}
},
onLoad() {},
onReachBottom() {
this.page = this.page + 1
this.getsearch()
},
methods: {
async getsearch() {
let res = await this.$http.index.search({
q: this.datalist,
page: this.page
})
this.content = [
...this.content,
...res
]
console.log(this.content)
},
getdata() {
this.content = []
this.getsearch()
this.Showhideo = true
},
goback() {
uni.navigateBack()
}
}
}
</script>
<style lang="less" scoped>
@import "../../common/less/page/search.less";
</style>

80
历届学生/吴欣阳/项目开发/美食app/pages/video/video.vue Normal file
View File

@@ -0,0 +1,80 @@
<template>
<view class="food_list">
<view class="food" v-for="(v,i) in content" :key="i" @click="InfoVideoInfo(v)">
<view class="food_img">
<image :src="v.bd_photo" mode="aspectFill"></image>
<i class="content_img_play"></i>
</view>
<view class="food_text">
<p>{{v.seo_title}}</p>
<view class="food_icon">
<view class="food_icon_lift">
<image src="../../static/img/user.jpg"></image>
<span>美食杰</span>
</view>
<view class="food_icon_right">
<i></i>
<span>{{v.click_num}}</span>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
total_page: 0,
page: 1,
content: []
}
},
onLoad() {
this.getvideo()
},
onReachBottom() {
this.page = this.page + 1
if (this.page < this.total_page) {
this.getvideo()
}
}, //触底判断请求
onNavigationBarButtonTap(e) {
console.log(e)
if(e.index == 0||e.index == 1){
uni.switchTab({
url: '/pages/index/index'
})
}else {
uni.navigateTo({
url: '/pages/search/search'
})
}
},
methods: {
async getvideo() {
let res = await this.$http.index.video({
page: this.page
});
this.total_page = res.total_page
this.content = [
...this.content,
...res.items
]
console.log(this.content);
},
InfoVideoInfo(VInfoData) {
var sti =JSON.stringify(VInfoData)
uni.navigateTo({
url: "/pages/videoinfo/videoinfo?str="+sti
})
}
}
}
</script>
<style scoped lang="less">
@import "../../common/less/page/video.less";
</style>

61
历届学生/吴欣阳/项目开发/美食app/pages/videoinfo/videoinfo.vue Normal file
View File

@@ -0,0 +1,61 @@
<template>
<view>
<view class="top">
<i class="iconfont" @click="backinfo()">&#xe601</i>
<span class="text" >{{videoData.seo_title}}</span>
<span></span>
</view>
<video :src="this.videoData.xhz_video_url" :poster="videoData.bd_photo"></video>
<view class="content_font">
<view class="title">{{videoData.seo_title}}</view>
<view class="content_font_span">
<span>时长:</span>
<span class="time">{{secondToTimeStr(total_time)}}</span>
</view>
<view class="user">
<image src="../../static/img/user.jpg"></image>
<view class="user_right">
<p>美食杰 <span>专业原创菜谱视频</span></p>
<p class="user_p">做菜只用美食杰，让做饭更具幸福感！</p>
</view>
</view>
<view class="title_s">视频内容</view>
<text class="content_c">{{videoData.intro}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
videoData:{},
total_time:{}
}
},
onLoad(str) {
this.videoData=JSON.parse(str.str)
},
methods: {
secondToTimeStr(t) {
if (!t) return;
if (t < 60) return "00:" + ((i = t) < 10 ? "0" + i : i);
if (t < 3600) return "" + ((a = parseInt(t / 60)) < 10 ? "0" + a : a) + ":" + ((i = t % 60) < 10 ? "0" + i : i);
if (3600 <= t) {
var a, i, e = parseInt(t / 3600);
return (e < 10 ? "0" + e : e) + ":" + ((a = parseInt(t % 3600 / 60)) < 10 ? "0" + a : a) + ":" + ((i = t % 60) < 10 ? "0" + i : i);
}
},
backinfo(){
uni.navigateBack()
}
}
}
</script>
<style lang="less" scoped>
@import "../../common/less/page/videoinfo.less";
</style>