邓洁: 修改页面细节

This commit is contained in:
邓洁
2023-11-04 00:32:49 +08:00
parent b5a66caa5c
commit e4119a7bcf
13 changed files with 271 additions and 456 deletions

View File

@@ -1,5 +1,4 @@
<template> <template>
<TabBar></TabBar>
</template> </template>
<script> <script>
export default { export default {
@@ -19,4 +18,4 @@
<style lang="scss"> <style lang="scss">
/*每个页面公共css */ /*每个页面公共css */
@import 'uview-ui/index.scss'; @import 'uview-ui/index.scss';
</style> </style>

View File

@@ -11,6 +11,7 @@
</view> </view>
</view> </view>
</block> </block>
<publishSlide v-if="slideVisit" @quitSlide="quitSlide"></publishSlide>
</view> </view>
</template> </template>
@@ -24,6 +25,7 @@
}, },
data() { data() {
return { return {
slideVisit: false,
currentItem: 0, currentItem: 0,
tabbarList: [{ tabbarList: [{
id: 0, id: 0,
@@ -41,9 +43,7 @@
centerItem: false centerItem: false
}, { }, {
id: 2, id: 2,
path: "/pages/publish/publish", icon: "/static/tabbar/di_icon_fb.png",
icon: "/static/tabbar/di_icon_fb@2x.png",
selectIcon: "/static/tabbar/di_icon_fb@2x.png",
text: "发布", text: "发布",
centerItem: true centerItem: true
}, { }, {
@@ -61,7 +61,6 @@
text: "我的", text: "我的",
centerItem: false centerItem: false
}] }]
}; };
}, },
mounted() { mounted() {
@@ -69,17 +68,23 @@
uni.hideTabBar(); uni.hideTabBar();
}, },
methods: { methods: {
quitSlide() {
this.slideVisit = false
},
changeItem(item) { changeItem(item) {
if (item.id == 2) {
this.slideVisit = true
}
let _this = this; let _this = this;
//_this.currentItem = item.id;
uni.switchTab({ uni.switchTab({
url: item.path url: item.path
}); });
} }
} }
} }
</script> </script>
<style> <style scoped>
view { view {
padding: 0; padding: 0;
margin: 0; margin: 0;
@@ -111,17 +116,18 @@
} }
.tabbar-container .item-active { .tabbar-container .item-active {
color: #339967; color: #CC3333;
} }
.tabbar-container .center-item { .tabbar-container .center-item {
display: block; display: block;
position: relative; position: relative;
} }
.tabbar-container .tabbar-item .item-top { .tabbar-container .tabbar-item .item-top {
width: 46rpx; width: 50rpx;
height: 46rpx; height: 50rpx;
padding: 0rpx; padding: 0rpx;
} }
@@ -145,7 +151,7 @@
} }
.tabbar-container .tabbar-item .item-bottom { .tabbar-container .tabbar-item .item-bottom {
font-size: 20rpx; font-size: 22rpx;
width: 100%; width: 100%;
margin-top: 3rpx; margin-top: 3rpx;
} }
@@ -153,5 +159,6 @@
.tabbar-container .center-item .item-bottom { .tabbar-container .center-item .item-bottom {
position: absolute; position: absolute;
bottom: 5rpx; bottom: 5rpx;
font-size: 24rpx;
} }
</style> </style>

View File

@@ -1,73 +1,79 @@
{ {
"name" : "city-store-transfer", "name": "city-store-transfer",
"appid" : "__UNI__F3EA0D6", "appid": "__UNI__F3EA0D6",
"description" : "", "description": "",
"versionName" : "1.0.0", "versionName": "1.0.0",
"versionCode" : "100", "versionCode": "100",
"transformPx" : false, "transformPx": false,
/* 5+App */ /* 5+App */
"app-plus" : { "app-plus": {
"usingComponents" : true, "usingComponents": true,
"nvueStyleCompiler" : "uni-app", "nvueStyleCompiler": "uni-app",
"compilerVersion" : 3, "compilerVersion": 3,
"splashscreen" : { "splashscreen": {
"alwaysShowBeforeRender" : true, "alwaysShowBeforeRender": true,
"waiting" : true, "waiting": true,
"autoclose" : true, "autoclose": true,
"delay" : 0 "delay": 0
}, },
/* */ /* */
"modules" : {}, "modules": {},
/* */ /* */
"distribute" : { "distribute": {
/* android */ /* android */
"android" : { "android": {
"permissions" : [ "permissions": [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>", "<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>", "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>", "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>", "<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
] ]
}, },
/* ios */ /* ios */
"ios" : {}, "ios": {},
/* SDK */ /* SDK */
"sdkConfigs" : {} "sdkConfigs": {}
} }
}, },
/* */ /* */
"quickapp" : {}, "quickapp": {},
/* */ /* */
"mp-weixin" : { "mp-weixin": {
"appid" : "wxda178d12ae834c45", "appid": "wxda178d12ae834c45",
"setting" : { "setting": {
"urlCheck" : false "urlCheck": false
}, },
"usingComponents" : true, "usingComponents": true,
"permission" : {} "permission": {
}, // 获取当前的地理位置、速度 配置
"mp-alipay" : { "scope.userLocation": {
"usingComponents" : true "desc": "你的位置信息将用于小程序位置接口的效果展示"
}, }
"mp-baidu" : { }
"usingComponents" : true
}, },
"mp-toutiao" : { "mp-alipay": {
"usingComponents" : true "usingComponents": true
}, },
"uniStatistics" : { "mp-baidu": {
"enable" : false "usingComponents": true
}, },
"vueVersion" : "2" "mp-toutiao": {
} "usingComponents": true
},
"uniStatistics": {
"enable": false
},
"vueVersion": "2"
}

View File

@@ -1,167 +1,140 @@
{ {
"easycom" : { "easycom": {
"autoscan" : true, //是否自动扫描组件 "autoscan": true, //是否自动扫描组件
"custom" : { "custom": {
"^u-(.*)" : "uview-ui/components/u-$1/u-$1.vue", "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue",
"^ua-(.*)" : "@/components/uview-ui/components/u-$1/u-$1.vue", "^ua-(.*)": "@/components/uview-ui/components/u-$1/u-$1.vue",
"^customer-(.*)" : "@/components/uni-$1.vue" // 匹配components目录内的vue文件 "^customer-(.*)": "@/components/uni-$1.vue" // 匹配components目录内的vue文件
} }
}, },
"pages" : [ "pages": [
//pages数组中第一项表示应用启动页参考https://uniapp.dcloud.io/collocation/pages //pages数组中第一项表示应用启动页参考https://uniapp.dcloud.io/collocation/pages
{ {
"path" : "pages/index/index", "path": "pages/index/index",
"style" : { "style": {
"navigationBarTitleText" : "速配商铺", "navigationBarTitleText": "速配商铺",
"navigationBarTextStyle" : "black", "navigationBarTextStyle": "black",
"navigationBarBackgroundColor" : "#FFFFFF", "navigationBarBackgroundColor": "#FFFFFF",
//导航栏取消 //导航栏取消
// "navigationStyle": "custom", // "navigationStyle": "custom",
//是否开启下拉刷新 //是否开启下拉刷新
"enablePullDownRefresh" : true "enablePullDownRefresh": true
}
},
{
"path" : "pages/shopTransfer/shopTransfer",
"style" : {
"navigationBarTitleText" : "店铺转让",
"navigationBarTextStyle" : "black",
"navigationBarBackgroundColor" : "#FFFFFF",
"enablePullDownRefresh" : false
}
},
//+
{
"path" : "pages/shopAddress/shopAddress",
"style" : {
"navigationBarTitleText" : "找店地址",
"navigationBarTextStyle" : "black",
"navigationBarBackgroundColor" : "#FFFFFF",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/my/my",
"style" : {
"navigationBarTitleText" : "我的",
"navigationBarTextStyle" : "black",
"navigationBarBackgroundColor" : "#FFFFFF",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/publish/publish",
"style" : {
"navigationBarTitleText" : "",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/detail/detail",
"style" : {
"navigationBarTitleText" : "商品详情"
} }
} },
{
,{ "path": "pages/shopTransfer/shopTransfer",
"path" : "pages/published/published", "style": {
"style" : "navigationBarTitleText": "店铺转让",
{ "navigationBarTextStyle": "black",
"navigationBarTitleText": "", "navigationBarBackgroundColor": "#FFFFFF",
"enablePullDownRefresh": true "enablePullDownRefresh": false
} }
},
} //+
,{ {
"path" : "pages/publish/publishTransfer/publishTransfer", "path": "pages/shopAddress/shopAddress",
"style" : "style": {
{ "navigationBarTitleText": "找店地址",
"navigationBarTitleText": "", "navigationBarTextStyle": "black",
"enablePullDownRefresh": false "navigationBarBackgroundColor": "#FFFFFF",
} "enablePullDownRefresh": false
}
} },
,{ {
"path" : "pages/publish/publishAddress/publishAddress", "path": "pages/my/my",
"style" : "style": {
{ "navigationBarTitleText": "我的",
"navigationBarTitleText": "", "navigationBarTextStyle": "black",
"enablePullDownRefresh": false "navigationBarBackgroundColor": "#FFFFFF",
} "enablePullDownRefresh": false
}
} },
,{ {
"path" : "pages/publish/publishRent/publishRent", "path": "pages/detail/detail",
"style" : "style": {
{ "navigationBarTitleText": "商品详情"
"navigationBarTitleText": "", }
"enablePullDownRefresh": false }, {
} "path": "pages/published/published",
"style": {
} "navigationBarTitleText": "",
,{ "enablePullDownRefresh": true
"path" : "pages/publish/publishInvestment/publishInvestment", }
"style" : }, {
{ "path": "pages/publish/publishTransfer/publishTransfer",
"navigationBarTitleText": "", "style": {
"enablePullDownRefresh": false "navigationBarTitleText": "",
} "enablePullDownRefresh": false
}
}
], }, {
"tabBar" : { "path": "pages/publish/publishAddress/publishAddress",
"color" : "#CCCCCC", "style": {
"borderStyle" : "white", "navigationBarTitleText": "",
"backgroundColor" : "#FFFFFF", "enablePullDownRefresh": false
"custom" : true, }
"list" : [
{ }, {
"pagePath" : "pages/index/index", "path": "pages/publish/publishRent/publishRent",
"text" : "首页", "style": {
"iconPath" : "static/tabbar/di_icon_syh.png", "navigationBarTitleText": "",
"selectedIconPath" : "static/tabbar/di_icon_sy.png" "enablePullDownRefresh": false
}, }
{
"pagePath" : "pages/shopTransfer/shopTransfer", }, {
"text" : "店铺转让", "path": "pages/publish/publishInvestment/publishInvestment",
"iconPath" : "static/tabbar/di_icon_zrh.png", "style": {
"selectedIconPath" : "static/tabbar/di_icon_zr.png" "navigationBarTitleText": "",
}, "enablePullDownRefresh": false
{ }
"pagePath" : "pages/publish/publish",
"text" : "发布", }
"iconPath" : "static/tabbar/di_icon_fb.png", ],
"selectedIconPath" : "static/tabbar/di_icon_fb.png" "tabBar": {
}, "color": "#CCCCCC",
{ "borderStyle": "white",
"pagePath" : "pages/shopAddress/shopAddress", "backgroundColor": "#FFFFFF",
"text" : "找店地址", "custom": true,
"iconPath" : "static/tabbar/di_icon_dzh.png", "list": [{
"selectedIconPath" : "static/tabbar/di_icon_dz.png" "pagePath": "pages/index/index",
}, "text": "首页",
{ "iconPath": "static/tabbar/di_icon_syh.png",
"pagePath" : "pages/my/my", "selectedIconPath": "static/tabbar/di_icon_sy.png"
"text" : "店铺转让", },
"iconPath" : "static/tabbar/di_icon_wdh.png",
"selectedIconPath" : "static/tabbar/di_icon_wd.png"
}
]
},
"globalStyle" : {
"navigationBarTextStyle" : "black",
"navigationBarTitleText" : "uni-app",
"navigationBarBackgroundColor" : "#F8F8F8",
"backgroundColor" : "#F8F8F8"
},
"uniIdRouter" : {},
"condition" : { //模式配置,仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [
{ {
"name": "", //模式名称 "pagePath": "pages/shopTransfer/shopTransfer",
"path": "", //启动页面,必选 "text": "店铺转让",
"query": "" //启动参数在页面的onLoad函数里面得到 "iconPath": "static/tabbar/di_icon_zrh.png",
"selectedIconPath": "static/tabbar/di_icon_zr.png"
},
{
"pagePath": "pages/shopAddress/shopAddress",
"text": "找店地址",
"iconPath": "static/tabbar/di_icon_dzh.png",
"selectedIconPath": "static/tabbar/di_icon_dz.png"
},
{
"pagePath": "pages/my/my",
"text": "店铺转让",
"iconPath": "static/tabbar/di_icon_wdh.png",
"selectedIconPath": "static/tabbar/di_icon_wd.png"
} }
] ]
},
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"uniIdRouter": {},
"condition": { //模式配置,仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [{
"name": "", //模式名称
"path": "", //启动页面,必选
"query": "" //启动参数在页面的onLoad函数里面得到
}]
} }
} }

View File

@@ -1,127 +0,0 @@
<template>
<view class="header-area">
<view class="search-box u-flex u-flex-nowarp u-row-between">
<view class="search-box-input" >
<u-input
:placeholder="hotSearchWord"
prefixIcon="search"
prefixIconStyle="font-size: 14px;color: #909399;margin-left:30rpx"
/>
</view>
<view class="search-box-location">
<view><u-icon name="map" color="#909399" size="15"></u-icon></view>
<view class="localtion-text"><text>{{position}}</text></view>
</view>
</view>
<view class="swiper">
<u-swiper :list="headerBgList"/>
<!-- <u-image :src=headerBgURL
class="header-bgimg" width="100vw" height="25vh"/> -->
</view>
</view>
</template>
<script>
export default{
name: "HomeHeader",
props: {
hotSearchWord:{
type: String,
default() {
return '热门关键词'
}
},
headerBgList:{
type: Array,
default() {
return ["https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg","https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg"]
}
},
position:{
type: String,
default() {
return '定位中'
}
}
},
data() {
return {
// hotSearchWord:'',
// headerBgList:[]
}
},
options: {
styleIsolation: 'shared' // 解除样式隔离
},
computed:{
}
}
</script>
<style lang="scss">
// 搜索区域样式
.header-area {
position: relative;
.search-box {
// background: #000;
position: absolute;
z-index: 1;
left: 50%;
width: 84.6%;
transform: translateX(-50%);
.search-box-input {
border-radius: 10px;
padding-top: 3px !important;
margin-top: 8px;
background-color: #fff;
.u-border{
border: none;
}
// 组件内部样式修改
.u-input__content {
background-color: #fff;
border-radius: 1;
height: 10px;
.u-input__content__field-wrapper__field {
// height: 10px !important;
font-size: 10px !important;
}
}
}
.search-box-location{
position: absolute;
z-index: 1;
height: 25px;
// width: 15vw;
top: 15px;
right: 10%;
// transform: translate(-100%);
display: flex;
.localtion-text{
padding-left: 8px;
font-size: 10px;
}
}
.header-bgimg {
width: 100vw;
z-index: 0;
}
}
// 轮播图样式
.swiper {
.u-swiper {
border-radius:0 !important;
}
.u-swiper__wrapper__item__wrapper__image{
border-radius:0 !important;
}
}
}
</style>

View File

@@ -1,66 +1,54 @@
<template> <template>
<view class="home-base-bg"> <view class="home-base-bg">
<view class="search_box">
<view class="search_box_border">
<!-- <u-input placeholder="搜索优质产品" placeholder-style="color: #969696" prefixIcon="search"
prefixIconStyle="font-size: 22px;color: #909399;margin-left:30rpx" readonly>
</u-input> -->
</view>
<InputAndSwiper></InputAndSwiper> <InputAndSwiper></InputAndSwiper>
<TabBar :current-page="0"></TabBar> <TabBar :current-page="0"></TabBar>
<view class="nav-card"> <view class="nav-card">
<u-grid :col="4"> <u-grid :col="4">
<u-grid-item> <u-grid-item>
<u-icon name="photo" :size="30"></u-icon> <u-icon name="photo" :size="30"></u-icon>
<view class="grid-text">图片</view> <view class="grid-text">图片</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="lock" :size="30"></u-icon> <u-icon name="lock" :size="30"></u-icon>
<view class="grid-text">锁头</view> <view class="grid-text">锁头</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="hourglass" :size="30"></u-icon> <u-icon name="hourglass" :size="30"></u-icon>
<view class="grid-text">沙漏</view> <view class="grid-text">沙漏</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="hourglass" :size="30"></u-icon> <u-icon name="hourglass" :size="30"></u-icon>
<view class="grid-text">沙漏</view> <view class="grid-text">沙漏</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="photo" :size="30"></u-icon> <u-icon name="photo" :size="30"></u-icon>
<view class="grid-text">图片</view> <view class="grid-text">图片</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="lock" :size="30"></u-icon> <u-icon name="lock" :size="30"></u-icon>
<view class="grid-text">锁头</view> <view class="grid-text">锁头</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="hourglass" :size="30"></u-icon> <u-icon name="hourglass" :size="30"></u-icon>
<view class="grid-text">沙漏</view> <view class="grid-text">沙漏</view>
</u-grid-item> </u-grid-item>
<u-grid-item> <u-grid-item>
<u-icon name="hourglass" :size="30"></u-icon> <u-icon name="hourglass" :size="30"></u-icon>
<view class="grid-text">沙漏</view> <view class="grid-text">沙漏</view>
</u-grid-item> </u-grid-item>
</u-grid> </u-grid>
</view> </view>
<view class="news-box"> <view class="news-box">
<u-notice-bar <u-notice-bar :text="newsTextLists" :bg-color="$uni-bg-color"></u-notice-bar>
:text="newsTextLists"
:bg-color="$uni-bg-color"
></u-notice-bar>
</view> </view>
<ShowShopListItem></ShowShopListItem> <ShowShopListItem></ShowShopListItem>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
components: { components: {
}, },
data() { data() {
return { return {
@@ -68,14 +56,15 @@
'寒雨连江夜入吴', '寒雨连江夜入吴',
'平明送客楚山孤', '平明送客楚山孤',
'洛阳亲友如相问', '洛阳亲友如相问',
'一片冰心在玉壶'], '一片冰心在玉壶'
],
} }
}, },
onLoad() { onLoad() {
}, },
methods: { methods: {
} }
} }
</script> </script>
@@ -85,11 +74,12 @@
background-color: $uni-bg-color-grey; background-color: $uni-bg-color-grey;
width: 100%; width: 100%;
} }
.nav-card { .nav-card {
margin: 15px 7px; margin: 15px 7px;
padding: 10px 0; padding: 10px 0;
background-color: $uni-bg-color; background-color: $uni-bg-color;
border-radius: $uni-border-radius-lg; border-radius: $uni-border-radius-lg;
box-shadow: 0 3px 3px 0 $u-border-color; box-shadow: 0 3px 3px 0 $u-border-color;
@@ -97,5 +87,4 @@
font-size: 14px; font-size: 14px;
} }
} }
</style> </style>

View File

@@ -1,32 +0,0 @@
<template>
<view>
<view class="test">
<button @click="slide()">test</button>
<publishSlide v-if="slideVisit" @quitSlide="quitSlide"></publishSlide>
</view>
<TabBar :current-page="2" />
</view>
</template>
<script>
export default {
data() {
return {
slideVisit : false
}
},
methods: {
slide(){
this.slideVisit = true
},
quitSlide(){
this.slideVisit = false
}
}
}
</script>
<style>
</style>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.0 KiB

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1008 B

After

Width:  |  Height:  |  Size: 989 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1017 B

After

Width:  |  Height:  |  Size: 983 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB