Merge branch 'prod' of https://gitlink.org.cn/h_kai/h5 into jxg_test_h5
This commit is contained in:
xg-29
commit
727017e572
|
|
@ -76,9 +76,10 @@ export default { // 所有接口
|
|||
sendTheVerificationCodeApp: (param) => ajax.get('sysUser/sendTheVerificationCodeApp', param), // 发送手机号验证码
|
||||
selectFoodsInfo: (param) => ajax.get(`doodsInfo/selectFoodsInfo`, param), // 查询食材详情
|
||||
selectDictListByFoodList: (param) => ajax.get('disease-assess-dict/selectDictListByFoodList2', param), //查询疾病字典
|
||||
getDiseaseFoodsLevel: (param) => ajax.get(`healthTools/getDiseaseFoodsLevel`, param), //食物榜单
|
||||
getDiseaseFoodsLevel: (param) => ajax.get(`healthTools/getDiseaseFoodsLevel2`, param), //食物榜单
|
||||
getFoodTypes: (param) => ajax.get('healthTools/getFoodTypes', param),
|
||||
selectFoodsList: (param) => ajax.get(`healthTools/selectFoodsList`, param), //食物成分
|
||||
queryEeFoodTypeDetails: (param) => ajax.get(`zksr.zksrservice.eefood/yh-ee-food-info/queryEeFoodTypeDetails`, param), //查询交换份食物信息
|
||||
queryEeFoodType: (param) => ajax.get(`zksr.zksrservice.eefood/yh-ee-food-type/queryEeFoodType`, param), //查询ee屏食物类型
|
||||
queryEeFoodInfo: (param) => ajax.get(`zksr.zksrservice.eefood/yh-ee-food-info/queryEeFoodInfo`, param), //查询食物信息
|
||||
queryEeFoodInfoDetails: (param) => ajax.get(`zksr.zksrservice.eefood/yh-ee-food-info/queryEeFoodInfoDetails`, param), //查询食物信息详情
|
||||
|
|
|
|||
|
|
@ -394,10 +394,21 @@
|
|||
"navigationBarTitleText": ""
|
||||
}
|
||||
},{
|
||||
"path": "exchangePortion/index/index1",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
}
|
||||
,{
|
||||
"path": "exchangePortion/detail/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},{
|
||||
"path": "foodexchange/index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
}]
|
||||
}]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,9 +18,10 @@
|
|||
{{item.foodsName}}
|
||||
</view>
|
||||
<view>
|
||||
<span class="themColor" style="font-size: 36px;">{{item.energy}}</span>
|
||||
<!-- <span class="themColor" style="font-size: 36px;">{{item.energy}}</span>
|
||||
<span class="themColor" style="font-size: 28px;">千卡</span>
|
||||
<span style="font-size: 28px;color:#666;">/100克</span>
|
||||
<span style="font-size: 28px;color:#666;">/100克</span> -->
|
||||
<span style="font-size: 28px;color:#666;" >{{ dataList[index][103][0] }} | {{ dataList[index][103][1] }}</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -118,6 +119,7 @@
|
|||
},
|
||||
total: 0, //总条数
|
||||
isHome: false, //返回首页图标是否显示
|
||||
dataList:[],
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
|
@ -151,6 +153,14 @@
|
|||
}).then(res => {
|
||||
if (res.code = 200) {
|
||||
this.foodList = res.rows
|
||||
res.rows.forEach(e => {
|
||||
console.log(e.elementContent);
|
||||
|
||||
this.dataList.push(JSON.parse(e.elementContent))
|
||||
|
||||
|
||||
});
|
||||
console.log(this.dataList);
|
||||
this.total = res.total
|
||||
this.$nextTick(() => {
|
||||
this.isPageShow = true
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@
|
|||
<view style="font-size: 44px;font-weight: 500;margin-bottom: 10px;">{{item.foodName}}
|
||||
</view>
|
||||
<view v-if='foodClass == 1'>
|
||||
<!-- <span style="font-size: 28px;color:#666;">钾含量 - | </span> -->
|
||||
<span class="themColor" style="font-size: 36px;">{{item.foodKcal}}</span>
|
||||
<span class="themColor" style="font-size: 28px;">千卡</span>
|
||||
<span style="font-size: 28px;color:#666;">/100克</span>
|
||||
|
|
@ -99,8 +100,8 @@
|
|||
// 食物列表
|
||||
foodList: [],
|
||||
contentText: '', //搜索框
|
||||
typeCode: '', //分类id
|
||||
selectIndex: null, //索引
|
||||
typeCode: 1, //分类id
|
||||
selectIndex: 0, //索引
|
||||
pageSize: 5,
|
||||
pageNum: 1,
|
||||
isPage: false,
|
||||
|
|
@ -113,10 +114,21 @@
|
|||
onLoad() {
|
||||
this.$API.queryEeFoodType({
|
||||
data: {
|
||||
userId: 29
|
||||
userId: 29,
|
||||
type:2
|
||||
}
|
||||
}).then(res => {
|
||||
this.diseaseList = res.data.slice(0,3)
|
||||
this.diseaseList = res.data
|
||||
let a = {
|
||||
english:"High calorie",
|
||||
foodType:"高油类",
|
||||
iconNotSelect:"https://sharkbaby.yhy.ren/ee_exchange/calorleNotSelect.png",
|
||||
iconSelect: "https://sharkbaby.yhy.ren/ee_exchange/calorleSelect.png",
|
||||
id:1,
|
||||
type:2
|
||||
}
|
||||
this.twoChane(a,0)
|
||||
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -181,6 +193,9 @@
|
|||
this.isPage = false
|
||||
this.selectIndex = null
|
||||
this.isHome = false
|
||||
uni.navigateTo({
|
||||
url: '/pages/hairtailScreen/exchangePortion/index/index1'
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,217 @@
|
|||
page {
|
||||
background: linear-gradient(90deg, #E3F5FF 0%, #ECF8FF 100%);
|
||||
width: 1080px;
|
||||
height: 1920px;
|
||||
}
|
||||
|
||||
.pageBox {
|
||||
padding: 40px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.homeHide{
|
||||
$wh:80px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
position: absolute;
|
||||
bottom: 300px;
|
||||
right: -40px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
.homeShow{
|
||||
$wh:80px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
position: absolute;
|
||||
bottom: 300px;
|
||||
right: 20px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
|
||||
.bestFoodBg {
|
||||
width: 1000px;
|
||||
height: 1508px;
|
||||
|
||||
}
|
||||
|
||||
.card {
|
||||
width: calc(100% - 80px);
|
||||
height: calc(1260px - 88px);
|
||||
background: #FFFFFF;
|
||||
border-radius: 12px;
|
||||
padding: 48px 40px 40px 40px;
|
||||
color: #171919;
|
||||
position: relative;
|
||||
|
||||
.preNext{
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 40px;
|
||||
left: 0;
|
||||
}
|
||||
.nothing{
|
||||
$wh:648px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
margin: 0 auto;
|
||||
margin-top: 160px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
|
||||
.foodImg {
|
||||
width: 206px;
|
||||
height: 154px;
|
||||
}
|
||||
|
||||
.themColor {
|
||||
color: #3AAFB8;
|
||||
}
|
||||
|
||||
.rightArrow {
|
||||
$wh: 48px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
|
||||
.cutt {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: #E9E9E9;
|
||||
margin: 24px 0 12px;
|
||||
}
|
||||
|
||||
.whiteBtn {
|
||||
width: 232px;
|
||||
line-height: 108px;
|
||||
text-align: center;
|
||||
border: 1px solid #FFFFFF;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 36px;
|
||||
color: #28A6B4;
|
||||
}
|
||||
}
|
||||
|
||||
.tagWidth {
|
||||
width: 317px;
|
||||
height: 150px;
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
border-radius: 12px;
|
||||
border: 1px solid #FFFFFF;
|
||||
|
||||
.text-four {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.text-eight {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.tagWidthShow {
|
||||
background: #11ACFF;
|
||||
}
|
||||
|
||||
.tagShow {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.tagHide{
|
||||
color: #42444F;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32px;
|
||||
margin-top: 32px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
// width: 232px;
|
||||
// height: 386px;
|
||||
width:488px;
|
||||
height:292px;
|
||||
background: rgba(255,255,255,0.4);
|
||||
border-radius: 12px 12px 12px 12px;
|
||||
border: 1px solid #FFFFFF;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32px;
|
||||
margin-top: 38px;
|
||||
.iconSelect{
|
||||
$wh:88px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
margin: 0 auto;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.exchangeTag{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.search{
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
position: relative;
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
image{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.inputClass{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 40px;
|
||||
padding-left: 40px;
|
||||
}
|
||||
.searchTitle{
|
||||
position: absolute;
|
||||
right: 66px;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 52px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//设置轮播的指示点大小
|
||||
::v-deep .uni-swiper-dots {
|
||||
// 指示点整个区域
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
::v-deep .uni-swiper-dot {
|
||||
// 指示点元素默认样式
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
::v-deep .uni-swiper-dot-active {
|
||||
// 指示点元素激活（当前选中）状态样式
|
||||
width: 48px;
|
||||
height: 14px;
|
||||
background: #28A6B4;
|
||||
border-radius: 26px 26px 26px 26px;
|
||||
}
|
||||
|
|
@ -0,0 +1,210 @@
|
|||
<template>
|
||||
<view class="pageBox">
|
||||
<view class="bestFoodBg" v-if="!isPage">
|
||||
<image src="../../static/images/exchangeBg.png" class="bestFoodBg"></image>
|
||||
</view>
|
||||
<view class="card" v-else>
|
||||
<view class="text-center text-bold" style="font-size: 48px;margin-bottom: 28px;color: #17191A;">
|
||||
<text v-if="selectIndex!=null">{{diseaseList[selectIndex].foodType}}</text>食物列表
|
||||
</view>
|
||||
<block v-if="foodList.length>0">
|
||||
<block v-for="(item,index) in foodList" :key="index">
|
||||
<view class="flex-between align-center" @tap="goDetail(item)">
|
||||
<view class="flex-contion">
|
||||
<view class="foodImg" style="margin-right: 48px;">
|
||||
<image :src="item.foodIcon" class="foodImg"></image>
|
||||
</view>
|
||||
<view>
|
||||
<view style="font-size: 44px;font-weight: 500;margin-bottom: 10px;">{{item.foodName}}
|
||||
</view>
|
||||
<view v-if='foodClass == 1'>
|
||||
<span class="themColor" style="font-size: 36px;">{{item.foodKcal}}</span>
|
||||
<span class="themColor" style="font-size: 28px;">千卡</span>
|
||||
<span style="font-size: 28px;color:#666;">/100克</span>
|
||||
</view>
|
||||
<view v-if='foodClass == 2'>
|
||||
<span class="themColor" style="font-size: 36px;">{{item.foodKcal}}</span>
|
||||
<span class="themColor" style="font-size: 28px;">mg钠</span>
|
||||
<span style="font-size: 28px;color:#666;">/100克</span>
|
||||
</view>
|
||||
<view v-if='foodClass == 3'>
|
||||
<span class="themColor" style="font-size: 36px;">{{item.foodWeight}}</span>
|
||||
<span class="themColor" style="font-size: 28px;">ml</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rightArrow">
|
||||
<image src="../../static/images/rightArrow.png" class="rightArrow"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cutt"></view>
|
||||
</block>
|
||||
<view class="flex justify-center preNext">
|
||||
<view class="whiteBtn" v-if="pageNum>1" @tap="previousPage">上一页</view>
|
||||
<view class="whiteBtn" v-if="totalWatch" @tap="nextPage">下一页</view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-if="isPageShow&&foodList.length==0">
|
||||
<view class="nothing">
|
||||
<image src="../../static/images/nothing.png"></image>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<!-- <view class="search">
|
||||
<image src="../../static/images/search.png"></image>
|
||||
<input placeholder="搜索您想要的食物" class="inputClass" v-model="contentText" @input="input" maxlength="17" />
|
||||
<view class="searchTitle" @tap="searchChange">搜索</view>
|
||||
</view> -->
|
||||
<view class="flex-between flex-wrap">
|
||||
<view v-for="(item,index) in diseaseList" :key="index"
|
||||
:class="['tag flex-conter bg-video','tagHide']"
|
||||
@tap="twoChane(item,index)">
|
||||
<!-- <image v-if="selectIndex==index" src="../../static/images/exchangeTag.png" class="exchangeTag">
|
||||
</image> -->
|
||||
<view class="bg-video text-center">
|
||||
<!-- <view class="iconSelect">
|
||||
<image :src="item.iconSelect"></image>
|
||||
</view> -->
|
||||
<view style="">{{item.foodType}}</view>
|
||||
<view :style="{fontSize:'20px',color:(''),width:'80%',margin:'auto',color:'#6E7477'}">
|
||||
{{item.english}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="homeHide" v-show="!isHome" @tap="backTap(0)">
|
||||
<image src="../../static/images/homeHide.png"></image>
|
||||
</view>
|
||||
<view class="homeShow" v-show="isHome" @tap="backTap(1)">
|
||||
<image src="../../static/images/homeShow.png"></image>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
toast,
|
||||
showLoading,
|
||||
hideLoading
|
||||
} from "/tool/index.js"
|
||||
export default {
|
||||
computed: {
|
||||
totalWatch() {
|
||||
return this.pageNum * 5 < this.total
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
diseaseList: [{
|
||||
foodType:"食物交换份",
|
||||
english:"食物以每提供 90kcal 能量为一“份” 制定食物交换表"
|
||||
},
|
||||
{
|
||||
foodType:"调味料换算表",
|
||||
english:"分析每份食谱中所含油、盐、 糖的含量"
|
||||
}],
|
||||
// 食物列表
|
||||
foodList: [],
|
||||
contentText: '', //搜索框
|
||||
typeCode: '', //分类id
|
||||
selectIndex: null, //索引
|
||||
pageSize: 5,
|
||||
pageNum: 1,
|
||||
isPage: false,
|
||||
total: 0, //总条数
|
||||
isPageShow: false, //列表是否显示
|
||||
isHome: false, //返回首页图标是否显示
|
||||
foodClass:"", //点击食品分类
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// this.$API.queryEeFoodType({
|
||||
// data: {
|
||||
// userId: 29
|
||||
// }
|
||||
// }).then(res => {
|
||||
// this.diseaseList = res.data.slice(0,3)
|
||||
// })
|
||||
},
|
||||
methods: {
|
||||
// 选择
|
||||
twoChane(item, index) {
|
||||
console.log(item);
|
||||
if(item.foodType == '调味料换算表'){
|
||||
uni.navigateTo({
|
||||
url: '/pages/hairtailScreen/exchangePortion/index/index'
|
||||
})
|
||||
}else{
|
||||
uni.navigateTo({
|
||||
url: '/pages/hairtailScreen/foodexchange/index/index'
|
||||
})
|
||||
}
|
||||
|
||||
// this.foodClass = item.id //食品分类，1，高油类，2，高钠类，3，饮料与糖
|
||||
// this.selectIndex = index
|
||||
// this.typeCode = item.id
|
||||
// this.pageNum = 1
|
||||
// this.getPageData()
|
||||
},
|
||||
// 列表数据
|
||||
getPageData() {
|
||||
this.isPageShow = false
|
||||
this.isPage = true
|
||||
this.$API.queryEeFoodInfo({
|
||||
data: {
|
||||
foodType: this.typeCode, //食物类型
|
||||
foodName: this.contentText, //食物名
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize,
|
||||
}
|
||||
}).then(res => {
|
||||
if (res.code == 200) {
|
||||
this.foodList = res.rows
|
||||
this.total = res.total
|
||||
this.$nextTick(() => {
|
||||
this.isPageShow = true
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 搜索input框
|
||||
input(e) {
|
||||
this.contentText = e.detail.value
|
||||
},
|
||||
// 搜索按钮
|
||||
searchChange() {
|
||||
this.pageNum = 1
|
||||
this.getPageData()
|
||||
},
|
||||
goDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/hairtailScreen/exchangePortion/detail/detail?id=' + item.id + '&type=' + this.foodClass
|
||||
})
|
||||
},
|
||||
// 上一页
|
||||
previousPage() {
|
||||
this.pageNum -= 1
|
||||
this.getPageData()
|
||||
},
|
||||
// 下一页
|
||||
nextPage() {
|
||||
this.pageNum += 1
|
||||
this.getPageData()
|
||||
},
|
||||
// 返回首页
|
||||
backTap(e) {
|
||||
if (e == 0) {
|
||||
this.isHome = true
|
||||
} else {
|
||||
this.isPage = false
|
||||
this.selectIndex = null
|
||||
this.isHome = false
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './index1.scss';
|
||||
</style>
|
||||
|
|
@ -0,0 +1,252 @@
|
|||
page {
|
||||
background: linear-gradient(90deg, #E3F5FF 0%, #ECF8FF 100%);
|
||||
width: 1080px;
|
||||
height: 1920px;
|
||||
}
|
||||
|
||||
.pageBox {
|
||||
padding: 36px 40px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.homeHide{
|
||||
$wh:80px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
position: absolute;
|
||||
bottom: 300px;
|
||||
right: -40px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
.homeShow{
|
||||
$wh:80px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
position: absolute;
|
||||
bottom: 300px;
|
||||
right: 20px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
.themColor {
|
||||
color: #3AAFB8;
|
||||
}
|
||||
.card {
|
||||
padding: 40px 40px 28px 40px;
|
||||
width: calc(100% - 80px);
|
||||
height: calc(1624px - 68px);
|
||||
background: #FFFFFF;
|
||||
.imgAddress{
|
||||
width: 206px;
|
||||
height: 154px;
|
||||
margin-right: 46px;
|
||||
}
|
||||
.titleInter{
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 44px;
|
||||
color: #171919;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.tag{
|
||||
min-width: 48px;
|
||||
line-height: 80px;
|
||||
background: #89CFD4;
|
||||
border-radius: 8px;
|
||||
padding: 0 8px;
|
||||
font-size: 32px;
|
||||
color: #FFFFFF;
|
||||
margin-right: 12px;
|
||||
}
|
||||
.topImg{
|
||||
width: 502px;
|
||||
height: 290px;
|
||||
margin-right: 32px;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.leftWidth{
|
||||
padding: 0 8px;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
background: #3AAFB8;
|
||||
border-radius: 8px;
|
||||
font-size: 32px;
|
||||
color: #FFFFFF;
|
||||
margin-right: 12px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.nameTitle{
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 48px;
|
||||
}
|
||||
.lowHeat{
|
||||
width: 48px;
|
||||
height: 62px;
|
||||
}
|
||||
::v-deep .uni-progress-bar {
|
||||
// 这主要是加上deep才能改变它原来的样式
|
||||
border-radius: 50px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
::v-deep .uni-progress-inner-bar{
|
||||
background: linear-gradient( 90deg, #36AAB1 0%, #6ACBD1 100%);
|
||||
border-radius: 50px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
.titleOne{
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 40px;
|
||||
color: #17191A;
|
||||
padding-top: 60px;
|
||||
}
|
||||
.item {
|
||||
border-bottom: 1px solid #EBEDF0;
|
||||
padding: 32px 0;
|
||||
}
|
||||
.left{
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 32px;
|
||||
color: #17191A;
|
||||
margin-right: 32px;
|
||||
}
|
||||
.right{
|
||||
font-size: 32px;
|
||||
color: #3F4040;
|
||||
}
|
||||
.yuan{
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
margin-right: 6px;
|
||||
margin-bottom: 4px;
|
||||
display: inline-block;
|
||||
}
|
||||
.dataList {
|
||||
color: #17191A;
|
||||
font-size: 32px;
|
||||
.title {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 40px;
|
||||
color: #17191A;
|
||||
margin-top: 60px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.cut{
|
||||
margin: 32px 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: #EBEDF0;
|
||||
}
|
||||
|
||||
.right {
|
||||
color: $uni-color;
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
span {
|
||||
padding: 0 20rpx;
|
||||
margin:0 30rpx 30rpx 0;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
}
|
||||
.audio {
|
||||
width: 100%;
|
||||
margin-bottom: 30rpx;
|
||||
audio {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.context {
|
||||
line-height: 44rpx;
|
||||
margin-bottom: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
.imageBox {
|
||||
width: 100%;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottomSelect {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
|
||||
.bottomImg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.lineHeight{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.titleShow {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 40px;
|
||||
color: #3AAFB8;
|
||||
}
|
||||
|
||||
.tagWidth {
|
||||
width: 160px;
|
||||
height: 4px;
|
||||
background: #3AAFB8;
|
||||
margin-top: 12px;
|
||||
}
|
||||
}
|
||||
.bottomBack{
|
||||
width: 100%;
|
||||
line-height: 76px;
|
||||
text-align: center;
|
||||
background: rgba(255,255,255,0.4);
|
||||
border-radius: 38px;
|
||||
border: 1px solid #FFFFFF;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
color: #17191A;
|
||||
margin-top: 28px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,156 @@
|
|||
<template>
|
||||
<view class="pageBox" v-if="pageShow">
|
||||
<view class="card flex flex-direction">
|
||||
<view class="flex justify-between">
|
||||
<view class="topImg">
|
||||
<image :src="fomeData.imgAddress"></image>
|
||||
</view>
|
||||
<view class="flex-sub flex justify-between flex-direction" style="margin: 24px 0 12px;">
|
||||
<view class="flex">
|
||||
<view class="leftWidth">{{tagLable}}</view>
|
||||
<view class="nameTitle flex-sub">{{fomeData.dishName}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<span class="themColor" style="font-size: 36px;">{{fomeData.heatAmount}}</span><span
|
||||
class="themColor" style="font-size: 28px;">千卡</span
|
||||
style="font-size: 28px;color:#666;"><span>/100克</span>
|
||||
</view>
|
||||
<view class="flex">
|
||||
<image src="../../static/images/lowHeat.png" class="lowHeat" style="margin-right: 8px;"></image>
|
||||
<view class="flex-sub" style="margin-top: 15px;">
|
||||
<progress :percent="fomeData.percentage" stroke-width="8" activeColor="#36AAB1"
|
||||
backgroundColor="#E5FDFF" ></progress>
|
||||
</view>
|
||||
<image src="../../static/images/highHeat.png" class="lowHeat" style="margin-left: 8px;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view scroll-y class="flex-sub" style="height: 0;">
|
||||
<block v-if="imgIndex==0">
|
||||
<block v-for="(item,index) in fomeData.nutrientInfo" :key="index">
|
||||
<view class="dataList" :style="{borderRadius:index==0?'0 0 20rpx 20rpx':''}"
|
||||
v-if="item.info.length!=0">
|
||||
<view class="title">{{item.name}}</view>
|
||||
<block v-for="(v,i) in item.info" :key="i">
|
||||
<view class="flex-between">
|
||||
<view class="left">{{v.nutrientName}}</view>
|
||||
<view class="right">{{v.nutrientValue}} {{v.company?v.company:''}}</view>
|
||||
</view>
|
||||
<view class="cut" v-if="i<item.info.length-1"></view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="dataList" style="border-radius: 0 0 20rpx 20rpx">
|
||||
<view class="c_list_null" v-if="!fomeData.nutrientInfo.length">
|
||||
<image src="/static/images/nth2.png" class="nth_image" mode="widthFix" />
|
||||
<text class="text">暂无数据~</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view style="padding-top: 24px;"></view>
|
||||
<block v-for="(item,index) in fomeData.dishInfo" :key="index">
|
||||
<view class="flex align-center" style="margin-top: 36px;">
|
||||
<image :src="item.imgAddress" class="imgAddress"></image>
|
||||
<view>
|
||||
<view class="titleInter">{{item.dishName}}</view>
|
||||
<view v-if="item.tags" class="flex flex-wrap">
|
||||
<view v-for="(item2,index2) in item.tags.split('、')" class="tag">{{item2}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="bottomSelect">
|
||||
<view class="bottomImg">
|
||||
<image
|
||||
:src="imgIndex==0?'https://sharkbaby.yhy.ren/leftBg.png':'https://sharkbaby.yhy.ren/rightBg.png'">
|
||||
</image>
|
||||
</view>
|
||||
<view class="bg-video lineHeight" @tap="selectChange(0)">
|
||||
<view :class="['title',imgIndex==0?'titleShow':'']">营养成分</view>
|
||||
<view class="tagWidth" v-if="imgIndex==0"></view>
|
||||
</view>
|
||||
<view class="bg-video lineHeight" @tap="selectChange(1)">
|
||||
<view :class="['title',imgIndex==1?'titleShow':'']">菜品搭配</view>
|
||||
<view class="tagWidth" v-if="imgIndex==1"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottomBack" @tap="back">返回上一页</view>
|
||||
<view class="homeHide" v-show="!isHome" @tap="backTap(0)">
|
||||
<image src="../../static/images/homeHide.png"></image>
|
||||
</view>
|
||||
<view class="homeShow" v-show="isHome" @tap="backTap(1)">
|
||||
<image src="../../static/images/homeShow.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
showLoading,
|
||||
hideLoading,
|
||||
} from "/tool/index.js"
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
imgIndex: 0,
|
||||
tagLable: '',
|
||||
fomeData: {},
|
||||
id: null, //食物id
|
||||
userId: '29',
|
||||
pageShow: false,
|
||||
isHome: false, //返回首页图标是否显示
|
||||
}
|
||||
},
|
||||
onLoad(opt) {
|
||||
this.tagLable=opt.lableName
|
||||
this.id = opt.id
|
||||
this.getFoodsInfo()
|
||||
},
|
||||
methods: {
|
||||
selectChange(index) {
|
||||
this.imgIndex = index
|
||||
},
|
||||
// 获取食材详情
|
||||
async getFoodsInfo() {
|
||||
let ret = await this.$API.selectFoodsInfo({
|
||||
data: {
|
||||
foodsId: this.id,
|
||||
userId: this.userId
|
||||
}
|
||||
})
|
||||
// 去除数组为0的数据
|
||||
if (ret.data.nutrientInfo.length != 0) {
|
||||
ret.data.nutrientInfo.forEach((item, index) => {
|
||||
item.info = item.info.filter((item1) => item1.nutrientValue !== 0);
|
||||
});
|
||||
}
|
||||
this.fomeData = ret.data || {}
|
||||
this.$nextTick(() => {
|
||||
this.pageShow = true
|
||||
})
|
||||
},
|
||||
// 返回上一页
|
||||
back() {
|
||||
history.go(-1)
|
||||
},
|
||||
// 返回首页
|
||||
backTap(e) {
|
||||
if (e == 0) {
|
||||
this.isHome = true
|
||||
} else {
|
||||
uni.reLaunch({
|
||||
url: '/pages/hairtailScreen/foodIngredients/index/index'
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './detail.scss'
|
||||
</style>
|
||||
|
|
@ -0,0 +1,259 @@
|
|||
page {
|
||||
background: linear-gradient(90deg, #E3F5FF 0%, #ECF8FF 100%);
|
||||
width: 1080px;
|
||||
height: 1920px;
|
||||
}
|
||||
|
||||
.pageBox {
|
||||
padding: 40px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.homeHide{
|
||||
$wh:80px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
position: absolute;
|
||||
bottom: 300px;
|
||||
right: -40px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
.homeShow{
|
||||
$wh:80px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
position: absolute;
|
||||
bottom: 300px;
|
||||
right: 20px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
|
||||
.bestFoodBg {
|
||||
width: 100%;
|
||||
height: 1260px;
|
||||
}
|
||||
|
||||
.card {
|
||||
width: calc(100% - 80px);
|
||||
height: calc(1460px - 88px);
|
||||
background: #FFFFFF;
|
||||
border-radius: 12px;
|
||||
padding: 48px 40px 40px 40px;
|
||||
color: #171919;
|
||||
position: relative;
|
||||
|
||||
.preNext{
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 40px;
|
||||
left: 0;
|
||||
}
|
||||
.nothing{
|
||||
$wh:648px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
margin: 0 auto;
|
||||
margin-top: 160px;
|
||||
image{
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
}
|
||||
|
||||
.foodImg {
|
||||
width: 206px;
|
||||
height: 154px;
|
||||
}
|
||||
|
||||
.themColor {
|
||||
color: #3AAFB8;
|
||||
}
|
||||
|
||||
.rightArrow {
|
||||
$wh: 48px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
}
|
||||
|
||||
.cutt {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
margin: 24px 0 12px;
|
||||
}
|
||||
|
||||
.whiteBtn {
|
||||
width: 232px;
|
||||
line-height: 108px;
|
||||
text-align: center;
|
||||
border: 1px solid #FFFFFF;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 36px;
|
||||
color: #28A6B4;
|
||||
}
|
||||
&_block{
|
||||
width: 840px;
|
||||
height: 118px;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
line-height: 118px;
|
||||
font-weight: bold;
|
||||
font-size: 40px;
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
border-radius: 12px;
|
||||
&_span1{
|
||||
width: 910px;
|
||||
height: 152px;
|
||||
background: rgba(137,207,212,0.1);
|
||||
border-radius: 12px 12px 12px 12px;
|
||||
border: 2px solid #3AAFB8;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tagWidth {
|
||||
width: 317px;
|
||||
height: 150px;
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
border-radius: 12px;
|
||||
border: 1px solid #FFFFFF;
|
||||
|
||||
.text-four {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.text-eight {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.tagWidthShow {
|
||||
background: #11ACFF;
|
||||
}
|
||||
|
||||
.tagShow {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.tagHide{
|
||||
color: #42444F;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32px;
|
||||
margin-top: 32px;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
height: 416px;
|
||||
|
||||
.tag {
|
||||
width: 232px;
|
||||
height: 158px;
|
||||
background: rgba(255,255,255,0.4);
|
||||
border-radius: 12px;
|
||||
border: 1px solid #FFFFFF;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 22px;
|
||||
margin-top: 24px;
|
||||
.iconSelect{
|
||||
$wh:232px;
|
||||
width: $wh;
|
||||
height: $wh;
|
||||
margin: 0 auto;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ingredientsBg{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
.search{
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
position: relative;
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
image{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.inputClass{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 40px;
|
||||
padding-left: 40px;
|
||||
}
|
||||
.searchTitle{
|
||||
position: absolute;
|
||||
right: 66px;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 52px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//设置轮播的指示点大小
|
||||
::v-deep .uni-swiper-dots {
|
||||
// 指示点整个区域
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
::v-deep .uni-swiper-dot {
|
||||
// 指示点元素默认样式
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
::v-deep .uni-swiper-dot-active {
|
||||
// 指示点元素激活（当前选中）状态样式
|
||||
width: 48px;
|
||||
height: 14px;
|
||||
background: #28A6B4;
|
||||
border-radius: 26px 26px 26px 26px;
|
||||
}
|
||||
.bg{
|
||||
width: 232px;
|
||||
height: 181px;
|
||||
background: url('../../static/images/bg.png');
|
||||
background-size: contain;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.bg2{
|
||||
width: 232px;
|
||||
height: 181px;
|
||||
background: url('../../static/images/bg2.png');
|
||||
background-size: contain;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.block_bg{
|
||||
width: 1840rpx;
|
||||
height: 936rpx;
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,233 @@
|
|||
<template>
|
||||
<view class="pageBox">
|
||||
<view class="bestFoodBg" v-if="!isPage&&name==null">
|
||||
<image src="../../static/images/ingredients.png" class="bestFoodBg"></image>
|
||||
</view>
|
||||
<view class="card" v-else>
|
||||
<view class="text-center text-bold" style="font-size: 48px;margin-bottom: 28px;color: #17191A;">
|
||||
<!-- <text v-if="name!=null">{{name}}</text>食物列表 -->
|
||||
食物交换份列表
|
||||
</view>
|
||||
<block v-if="foodList.length>0">
|
||||
|
||||
</block>
|
||||
<block v-if="isPageShow&&foodList.length==0">
|
||||
<view class="nothing">
|
||||
<image src="../../static/images/nothing.png"></image>
|
||||
</view>
|
||||
</block>
|
||||
<view class="block_bg">
|
||||
<image :src="foodList.typeIcon" style="width: 920px;height: 468px;"></image>
|
||||
</view>
|
||||
<view class="card_block">{{foodList.foodType}}</view>
|
||||
<scroll-view style="height: 800px;" scroll-y="true">
|
||||
<block v-for="(item,index) in foodList.foodInfos">
|
||||
<view style="margin-top: 20px;" class="card_block_span1">
|
||||
<!-- {{ item.foodDescribe }} -->
|
||||
<view><image :src="item.foodIcon" style="width: 132px;height: 132px;margin-top: 10px;border-radius: 6px;margin-left: 10px;"></image></view>
|
||||
<view style="font-weight: 500;font-size: 36px;line-height: 152px;"><span style="margin-left: 10px;"> {{item.foodWeight}}</span> <span>{{item.foodUnit}}</span> <span>{{ item.foodName }}</span> <span style="margin-left: 5px;margin-right: 5px;">|</span><span style="color: #6E7477;">{{ item.foodDescribe }}</span> </view>
|
||||
<view style="line-height: 152px;margin-right: 10px;color: #6E7477;font-size: 36px;font-weight: 400;margin-left: auto;">一份</view>
|
||||
</view>
|
||||
{{ }}
|
||||
<view style="text-align: center;" v-if="(foodList.foodInfos.length - 1) != index"><image src="https://sharkbaby.yhy.ren/Group%20427320991%402x.png" style="width: 80px;height: 80px;margin-top: 20px;"></image></view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="search">
|
||||
<image src="../../static/images/search.png"></image>
|
||||
<input placeholder="搜索您想要的食物" class="inputClass" v-model="contentText" @input="input" maxlength="17" />
|
||||
<view class="searchTitle" @tap="searchChange">搜索</view>
|
||||
</view> -->
|
||||
<!-- <swiper class="swiper" circular indicator-dots indicator-color="#fff">
|
||||
<block v-for="(item,index) in diseaseList" :key="index">
|
||||
<swiper-item>
|
||||
{{ item.foodType }}
|
||||
<view class="flex-between flex-wrap">
|
||||
<view v-for="(item1,index1) in item" :key="index1"
|
||||
:class="['tag flex-conter bg-video',name==item1.typeName?'tagShow':'tagHide']"
|
||||
@tap="twoChane(item1)">
|
||||
<image v-if="name==item1.typeName" src="../../static/images/ingredientsBg.png"
|
||||
class="ingredientsBg"></image>
|
||||
<view class="bg-video text-center">
|
||||
<view class="iconSelect">
|
||||
<image :src="name==item1.typeName?item1.imgUrl:item1.imgUrl1"></image>
|
||||
</view>
|
||||
<view style="margin-top: 16px;">{{item1.foodType}}</view>
|
||||
<view
|
||||
:style="{fontSize:'16px',color:(name==item1.typeName?'rgba(255,255,255,0.6)':'')}">
|
||||
{{item1.engName}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper> -->
|
||||
<view class="flex-between flex-wrap" style="">
|
||||
<view v-for="(item,index) in diseaseList" :key="index"
|
||||
:class="['tag flex-conter bg-video',selectIndex==index?'tagShow':'tagHide']"
|
||||
@tap="twoChane(item,index)">
|
||||
<!-- <image v-if="selectIndex==index" src="../../static/images/exchangeTag.png" class="exchangeTag">
|
||||
</image> -->
|
||||
<view :class="selectIndex==index ? 'bg-video text-center bg2' : 'bg-video text-center bg' ">
|
||||
<view class="iconSelect" style="margin-top: 10px;">
|
||||
<image :src="selectIndex==index?item.iconNotSelect:item.iconSelect" style="width: 68px;height: 68px;"></image>
|
||||
</view>
|
||||
<view style="margin-top: 16px;">{{item.foodType}}</view>
|
||||
<view :style="{fontSize:'20px',color:(selectIndex==index?'rgba(255,255,255,0.6)':'')}">
|
||||
{{item.english}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="homeHide" v-show="!isHome" @tap="backTap(0)">
|
||||
<image src="../../static/images/homeHide.png"></image>
|
||||
</view>
|
||||
<view class="homeShow" v-show="isHome" @tap="backTap(1)">
|
||||
<image src="../../static/images/homeShow.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
toast,
|
||||
showLoading,
|
||||
hideLoading
|
||||
} from "/tool/index.js"
|
||||
export default {
|
||||
computed: {
|
||||
totalWatch() {
|
||||
return this.pageNum * 5 < this.total
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
diseaseList: [],
|
||||
name: null,
|
||||
// 食物列表
|
||||
foodList: [],
|
||||
contentText: '', //搜索框
|
||||
typeCode: '', //分类id
|
||||
pageSize: 5,
|
||||
pageNum: 1,
|
||||
isPage: false,
|
||||
total: 0, //总条数
|
||||
isPageShow: false, //列表是否显示
|
||||
isHome: false, //返回首页图标是否显示
|
||||
selectIndex: 0, //索引
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.$API.queryEeFoodType({
|
||||
data: {
|
||||
userId: 29,
|
||||
type:1
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res.data);
|
||||
this.diseaseList = res.data
|
||||
console.log(this.diseaseList);
|
||||
// this.diseaseList = this.getArr(res.rows, 8)
|
||||
|
||||
let a = {
|
||||
english:"Cereal",
|
||||
foodType:"谷薯杂豆类",
|
||||
iconNotSelect:"https://sharkbaby.yhy.ren/ee_exchange/cerealNotSelect.png",
|
||||
iconSelect: "https://sharkbaby.yhy.ren/ee_exchange/cerealSelect.png",
|
||||
id:4,
|
||||
type:1
|
||||
}
|
||||
this.twoChane(a,0)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getArr(arr, num) {
|
||||
let newArr = [...arr] // 因为splice会改变原数组，要深拷贝一下
|
||||
let list = []
|
||||
for (let i = 0; i < newArr.length;) {
|
||||
list.push(newArr.splice(i, num))
|
||||
}
|
||||
return list
|
||||
},
|
||||
// 选择
|
||||
twoChane(item1,index) {
|
||||
console.log(index);
|
||||
this.name = item1.foodType
|
||||
this.selectIndex = index
|
||||
this.typeCode = item1.id
|
||||
this.pageNum = 1
|
||||
this.getPageData()
|
||||
},
|
||||
// 列表数据
|
||||
getPageData() {
|
||||
this.isPageShow = false
|
||||
this.$API.queryEeFoodTypeDetails({
|
||||
data: {
|
||||
foodType: this.typeCode,
|
||||
// foodsInfo: this.contentText,
|
||||
// pageNum: this.pageNum,
|
||||
// pageSize: this.pageSize,
|
||||
}
|
||||
}).then(res => {
|
||||
if(res.code == 200){
|
||||
this.foodList = res.data
|
||||
}
|
||||
|
||||
// if (res.code == 200) {
|
||||
// this.total = res.total
|
||||
// this.$nextTick(() => {
|
||||
// this.isPageShow = true
|
||||
// })
|
||||
// }
|
||||
})
|
||||
},
|
||||
// 搜索input框
|
||||
input(e) {
|
||||
this.contentText = e.detail.value
|
||||
},
|
||||
// 搜索按钮
|
||||
searchChange() {
|
||||
this.pageNum = 1
|
||||
this.isPage = true
|
||||
this.getPageData()
|
||||
},
|
||||
goDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/hairtailScreen/foodIngredients/detail/detail?id=' + item.id + '&lableName=' + item
|
||||
.typeName
|
||||
})
|
||||
},
|
||||
// 上一页
|
||||
previousPage() {
|
||||
this.pageNum -= 1
|
||||
this.getPageData()
|
||||
},
|
||||
// 下一页
|
||||
nextPage() {
|
||||
this.pageNum += 1
|
||||
this.getPageData()
|
||||
},
|
||||
// 返回首页
|
||||
backTap(e) {
|
||||
|
||||
if (e == 0) {
|
||||
this.isHome = true
|
||||
} else {
|
||||
this.isPage = false
|
||||
this.name = null
|
||||
this.selectIndex = null
|
||||
this.isHome = false
|
||||
uni.navigateTo({
|
||||
url: '/pages/hairtailScreen/exchangePortion/index/index1'
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './index.scss';
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 148 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.5 MiB After Width: | Height: | Size: 6.6 MiB |
|
|
@ -154,7 +154,8 @@
|
|||
console.log(option, "option")
|
||||
this.$REGIST.queryMattersName({
|
||||
data:{
|
||||
queryDate:option.queryDate//上一个页面的日期
|
||||
queryDate:option.queryDate,//上一个页面的日期
|
||||
type:option.type == 2 ? option.type : 1
|
||||
}
|
||||
}).then(res => {
|
||||
res.data.map(item => {
|
||||
|
|
@ -246,6 +247,11 @@
|
|||
if (res.code == 200) {
|
||||
toast('保存成功')
|
||||
jWeixin.miniProgram ? jWeixin.miniProgram.navigateBack() : jWeixin.navigateBack();
|
||||
if (window.Android) {
|
||||
window.Android.goback()
|
||||
} else if (window.webkit) {
|
||||
window.webkit.messageHandlers.goback.postMessage();
|
||||
}
|
||||
setTimeout(()=>{
|
||||
uni.navigateBack()
|
||||
},1000)
|
||||
|
|
|
|||
Loading…
Reference in New Issue