dengjie commit: tabbar样式修改完成

This commit is contained in:
clay
2022-12-07 13:41:17 +08:00
parent f1bd49efb2
commit 2fc863bb79
36 changed files with 93 additions and 212 deletions

View File

@@ -4,13 +4,82 @@
}, },
"pages": [ //pages数组中第一项表示应用启动页参考https://uniapp.dcloud.io/collocation/pages "pages": [ //pages数组中第一项表示应用启动页参考https://uniapp.dcloud.io/collocation/pages
{ {
"path": "pages/index/tabbar", "path": "pages/index/index",
"style": { "style": {
"navigationBarTitleText": "食瞳", "navigationBarTitleText": "食瞳",
"navigationStyle": "custom" // "navigationBarTextStyle": "white",
//导航栏取消
// "navigationStyle": "custom",
//是否开启下拉刷新
"enablePullDownRefresh": false
}
},
{
"path": "pages/report/report",
"style": {
"navigationBarTitleText": "行业报告",
"enablePullDownRefresh": false
}
},
{
"path": "pages/ideasAndNeeds/ideasAndNeeds",
"style": {
"navigationBarTitleText": "创意&需求",
"enablePullDownRefresh": false
}
},
{
"path": "pages/product/product",
"style": {
"navigationBarTitleText": "产品分类",
"enablePullDownRefresh": false
}
},
{
"path": "pages/my/my",
"style": {
"navigationBarTitleText": "我的",
"enablePullDownRefresh": false
} }
} }
], ],
"tabBar": {
"color": "#CCCCCC",
"selectedColor": "#0EBB5B",
"borderStyle": "none",
"backgroundColor": "#FFFFFF",
"list": [{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "static/tabbar/sy_icon_syh.png",
"selectedIconPath": "static/tabbar/sy_icon_sy(1).png"
},
{
"pagePath": "pages/report/report",
"text": "行业报告",
"iconPath": "static/tabbar/sy_icon_hyh.png",
"selectedIconPath": "static/tabbar/sy_icon_sy.png"
},
{
"pagePath": "pages/ideasAndNeeds/ideasAndNeeds",
"text": "创意&需求",
"iconPath": "static/tabbar/sy_icon_cyh.png",
"selectedIconPath": "static/tabbar/sy_icon_cy.png"
},
{
"pagePath": "pages/product/product",
"text": "产品分类",
"iconPath": "static/tabbar/sy_icon_cph.png",
"selectedIconPath": "static/tabbar/sy_icon_cp.png"
},
{
"pagePath": "pages/my/my",
"text": "我的",
"iconPath": "static/tabbar/sy_icon_wdh.png",
"selectedIconPath": "static/tabbar/sy_icon_wd.png"
}
]
},
"globalStyle": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app", "navigationBarTitleText": "uni-app",

View File

@@ -0,0 +1,22 @@
<template>
<view>
创意需求
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>

View File

@@ -1,22 +0,0 @@
<template>
<view>创意工厂</view>
</template>
<script>
export default {
methods: {
setStor() {
uni.setStorage({
key: 'id',
data: 100,
success() {
console.log('存储成功')
}
})
}
}
}
</script>
<style>
</style>

View File

@@ -1,5 +0,0 @@
<template>
<view class="components-home">
需求发布
</view>
</template>

View File

@@ -1,183 +0,0 @@
<template>
<view>
<index @ShowNews="ShowNews" v-if="PageCur=='index'"></index>
<report v-if="PageCur=='report'"></report>
<release v-if="PageCur=='release'"></release>
<industry v-if="PageCur=='industry'"></industry>
<product v-if="PageCur=='product'"></product>
<my v-if="PageCur=='my'"></my>
<view class="box">
<view class="cu-bar tabbar bg-white shadow foot">
<view class="action" @click="NavChange" data-cur="index">
<view class='cuIcon-cu-image'>
<image v-if="PageCur=='index'" src="../../static/tabBar/index_cur.png"></image>
<image v-if="PageCur != 'index'" src="../../static/tabBar/index.png"></image>
</view>
<view :class="PageCur=='index'?'color_main':'text-gray'">首页</view>
</view>
<view class="action" @click="NavChange" data-cur="report">
<view class='cuIcon-cu-image'>
<!-- <view class="cu-tag badge"> -->
<!-- 红点 -->
<!-- </view> -->
<image v-if="PageCur=='report'" src="../../static/tabBar/shop_cur.png"></image>
<image v-if="PageCur != 'report'" src="../../static/tabBar/shop.png"></image>
</view>
<view :class="PageCur=='report'?'color_main':'text-gray'">行业报告</view>
</view>
<view class="action text-gray add-action">
<u-popup :show="show" mode="bottom" @close="close" safeAreaInsetBottom
overlay-class="header-overlay">
<view class="more_box">
<!-- 需求发布 -->
<view class="more_action" @close="close" @click="NavChange" data-cur="release">
<view class='more_image'>
<image src="../../static/tabBar/index.png"></image>
</view>
<view class="img_text">需求发布</view>
</view>
<!-- 创意工厂 -->
<view class="more_action" @close="close" @click="NavChange" data-cur="industry">
<view class='more_image'>
<image src="../../static/tabBar/index.png"></image>
</view>
<view class="img_text">创意工厂</view>
</view>
</view>
<view class="more_jian"></view>
</u-popup>
<image class="logo_btn" mode="widthFix" src="../../static/logo.png" @click="show = true"></image>
</view>
<view class="action" @click="NavChange" data-cur="product">
<view class='cuIcon-cu-image'>
<!-- <view class="cu-tag badge">{{message}}</view> -->
<image v-if="PageCur=='product'" src="../../static/tabBar/order_cur.png"></image>
<image v-if="PageCur != 'product'" src="../../static/tabBar/order.png"></image>
</view>
<view :class="PageCur=='product'?'color_main':'text-gray'">产品分类</view>
</view>
<view class="action" @click="NavChange" data-cur="my">
<view class='cuIcon-cu-image'>
<image v-if="PageCur=='my'" src="../../static/tabBar/me_cur.png"></image>
<image v-if="PageCur != 'my'" src="../../static/tabBar/me.png"></image>
</view>
<view :class="PageCur=='my'?'color_main':'text-gray'">我的</view>
</view>
</view>
</view>
</view>
</template>
<script>
import index from "./index.vue"; //首页
import report from "./report.vue"; //行业报告
import release from "./release.vue"; //需求发布
import industry from "./industry.vue"; //需求发布
import product from "./product.vue"; //产品分类
import my from "./my.vue"; //我的
export default {
components: {
index,
report,
release,
industry,
product,
my
},
data() {
return {
PageCur: 'index',
// message: '0',
openId: '',
access_token: '',
tip: "我是提示",
duration: 1,
// 显示更多tabbar
show: false
};
},
methods: {
ShowNews(e) {
console.log(e)
this.PageCur = e;
},
close() {
this.show = false
},
NavChange: function(e) {
this.PageCur = e.currentTarget.dataset.cur;
}
}
}
</script>
<style lang="scss">
.color_main {
color: #000000;
font-weight: 900;
}
.logo_btn {
width: 38*2rpx;
height: 38*2rpx;
position: absolute;
z-index: 2;
border-radius: 50%;
top: -40rpx;
left: 0rpx;
right: 0;
margin: auto;
padding: 0;
}
.more_box {
display: flex;
align-items: center;
min-height: 100upx;
justify-content: space-around;
.more_action {
.more_image {
image {
width: 50upx;
height: 50upx;
display: inline-block;
}
}
.img_text {}
}
}
.more_jian {
position: absolute;
bottom: -10px;
left: 45%;
width: 0;
height: 0;
border-top: 10px solid white;
border-right: 10px solid transparent;
border-left: 10px solid transparent;
}
/deep/ .u-popup__content {
background-color: #fff;
position: relative;
width: 180px;
margin: 0 auto 86px auto;
border-radius: 10px;
}
// /deep/.u-slide-up-enter-active {
// height: 68px;
// margin-bottom: 65px;
// }
</style>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 848 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 957 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 706 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB