odjbin/city-store-transfer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

梁航：个人主页和详情页的更新

Browse Source
This commit is contained in:
hot777zz
2023-11-01 11:44:06 +08:00
parent 6ea0c2f048 529d64d200
commit af09d06203
29 changed files with 1733 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.hbuilderx/launch.json
View File

@@ -2,6 +2,10 @@
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
"version": "0.0",
"configurations": [{
"app-plus" :
{
"launchtype" : "local"
},
"default" :
{
"launchtype" : "local"

5
App.vue
View File

@@ -1,3 +1,6 @@
<template>
<TabBar></TabBar>
</template>
<script>
export default {
onLaunch: function() {
@@ -14,4 +17,4 @@
<style>
/*每个页面公共css */
</style>
</style>

157
components/TabBar/TabBar.vue Normal file
View File

@@ -0,0 +1,157 @@
<template>
<view class="tabbar-container">
<block>
<view class="tabbar-item" v-for="(item,index) in tabbarList" :class="[item.centerItem ? ' center-item' : '']"
@click="changeItem(item)">
<view class="item-top">
<image :src="currentItem==item.id?item.selectIcon:item.icon"></image>
</view>
<view class="item-bottom" :class="[currentItem==item.id ? 'item-active' : '']">
<text>{{item.text}}</text>
</view>
</view>
</block>
</view>
</template>
<script>
export default {
props: {
currentPage: {
type: Number,
default: 0
}
},
data() {
return {
currentItem: 0,
tabbarList: [{
id: 0,
path: "/pages/index/index",
icon: "/static/tabbar/di_icon_syh.png",
selectIcon: "/static/tabbar/di_icon_sy.png",
text: "首页",
centerItem: false
}, {
id: 1,
path: "/pages/shopTransfer/shopTransfer",
icon: "/static/tabbar/di_icon_zrh.png",
selectIcon: "/static/tabbar/di_icon_zr.png",
text: "店铺转让",
centerItem: false
}, {
id: 2,
path: "/pages/publish/publish",
icon: "/static/tabbar/di_icon_fb@2x.png",
selectIcon: "/static/tabbar/di_icon_fb@2x.png",
text: "发布",
centerItem: true
}, {
id: 3,
path: "/pages/shopAddress/shopAddress",
icon: "/static/tabbar/di_icon_dzh.png",
selectIcon: "/static/tabbar/di_icon_dz.png",
text: "找店地址",
centerItem: false
}, {
id: 4,
path: "/pages/my/my",
icon: "/static/tabbar/di_icon_wdh.png",
selectIcon: "/static/tabbar/di_icon_wd.png",
text: "我的",
centerItem: false
}]
};
},
mounted() {
this.currentItem = this.currentPage;
uni.hideTabBar();
},
methods: {
changeItem(item) {
let _this = this;
//_this.currentItem = item.id;
uni.switchTab({
url: item.path
});
}
}
}
</script>
<style>
view {
padding: 0;
margin: 0;
box-sizing: border-box;
}
.tabbar-container {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 98rpx;
display: flex;
align-items: center;
/* padding: 5rpx 0; */
color: #999999;
z-index: 200;
background-color: #fff;
}
.tabbar-container .tabbar-item {
width: 20%;
height: 82rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
.tabbar-container .item-active {
color: #339967;
}
.tabbar-container .center-item {
display: block;
position: relative;
}
.tabbar-container .tabbar-item .item-top {
width: 46rpx;
height: 46rpx;
padding: 0rpx;
}
.tabbar-container .center-item .item-top {
flex-shrink: 0;
width: 100rpx;
height: 100rpx;
position: absolute;
top: -61rpx;
left: calc(50% - 50rpx);
border-radius: 50%;
}
.tabbar-container .tabbar-item .item-top image {
width: 100%;
height: 100%;
}
tabbar-container .tabbar-item:nth-child(3) .item-top image {
background: #ff0000;
}
.tabbar-container .tabbar-item .item-bottom {
font-size: 20rpx;
width: 100%;
margin-top: 3rpx;
}
.tabbar-container .center-item .item-bottom {
position: absolute;
bottom: 5rpx;
}
</style>

156
components/inputAndSwiper/inputAndSwiper.vue Normal file
View File

@@ -0,0 +1,156 @@
<template>
<view>
<view class="search-box">
<view class="search-box-input">
<u-input placeholder="热门搜索" placeholder-style="color: #969696" prefixIcon="search"
prefixIconStyle="font-size: 24px;color: #909399;" border="true">
<template slot="suffix">
<view style="display: flex;align-items: center;">
<u-icon name="map-fill" color="#329866" size="22"></u-icon>
<text class="position">{{position}}</text>
</view>
</template>
</u-input>
</view>
</view>
<u-swiper :list="headerBgList" height="300rpx" />
</view>
</template>
<script>
import QQMapWX from "@/utils/qqmap-wx-jssdk.min.js"
export default {
name: "inputAndSwiper",
props: {
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",
"https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg"
]
}
},
position: {
type: String,
default () {
return '定位'
}
}
},
data() {
return {
};
},
options: {
styleIsolation: 'shared', // 解除样式隔离
},
created() {
// this.getLocation()
},
methods: {
getLocation(){
uni.getLocation({
type: 'wgs84',
// geocode: true, // 返回城市信息
// enableHighAccuracy: false, // 开启高精度模式
success: function(res) {
let qqmapsdk = new QQMapWX({
key: 'ZRKBZ-Q7FWL-GVZPK-MCRBU-4XFB5-ATBDB'
});
qqmapsdk.reverseGeocoder({
location: {
latitude: res.latitude,
longitude: res.longitude
},
success: (re) => {
console.log(re.result.ad_info.city, '成都市==');
console.log(re.result.ad_info.district, '武侯区==');
},
fail: (re) => {
console.log(re, '失败信息');
}
})
}
});
},
//提示用户开启定位服务
open() {
// uni.authorize({
// scope: 'scope.userLocation',
// success: function() {
// console.log('授权成功');
// },
// fail: function() {
// console.log('授权失败');
// }
// })
// wx.getSetting({
// success: (res) => {
// if (res.authSetting['scope.userLocation'] === false) {
// wx.showModal({
// title: '提示',
// content: '请打开定位服务后重新进入该页面',
// confirmText: '去设置',
// success: (res) => {
// if (res.confirm) {
// wx.openSetting()
// }
// }
// })
// }
// }
// })
}
}
}
</script>
<style lang="scss">
.search-box {
position: absolute;
z-index: 1;
left: 50%;
width: 84.6%;
transform: translateX(-50%);
.search-box-input {
border-radius: 12rpx;
margin-top: 20rpx;
background-color: #fff;
opacity: 0.85;
.u-border {
border: none;
.u-input__content {
height: 62rpx;
border-radius: 12rpx;
background-color: #fff;
.u-input__content__field-wrapper__field {
font-size: 26rpx !important;
}
}
}
}
}
.position {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #232323;
line-height: 33rpx;
}
.u-swiper {
border-radius: 0 !important;
.u-swiper__wrapper__item__wrapper__image {
border-radius: 0 !important;
}
}
</style>

1
main.js
View File

@@ -6,7 +6,6 @@ import {
toast
} from "./service/request.js"
Vue.use(uView)
Vue.prototype.$api = apiService
Vue.prototype.$toast = toast

3
manifest.json
View File

@@ -54,7 +54,8 @@
"setting" : {
"urlCheck" : false
},
"usingComponents" : true
"usingComponents" : true,
"permission" : {}
},
"mp-alipay" : {
"usingComponents" : true

169
pages.json
View File

@@ -1,58 +1,121 @@
{
"easycom": {
"autoscan": true, //是否自动扫描组件
"custom": {
"^u-(.*)": "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文件
}
},
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app",
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#12CA64",
//导航栏取消
// "navigationStyle": "custom",
//是否开启下拉刷新
"enablePullDownRefresh": true
"easycom" : {
"autoscan" : true, //是否自动扫描组件
"custom" : {
"^u-(.*)" : "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文件
}
},
"pages" : [
//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path" : "pages/index/index",
"style" : {
"navigationBarTitleText" : "速配商铺",
"navigationBarTextStyle" : "black",
"navigationBarBackgroundColor" : "#FFFFFF",
//导航栏取消
// "navigationStyle": "custom",
//是否开启下拉刷新
"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/my/my",
"style": {
"navigationBarTitleText": "我的",
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#12CA64",
"enablePullDownRefresh": false
}
}
],
"tabBar": {
"color": "#CCCCCC",
"selectedColor": "#0EBB5B",
"borderStyle": "white",
"backgroundColor": "#FFFFFF",
"list": [{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "static/tabbar/sy_icon_syh.png",
"selectedIconPath": "static/tabbar/sy_icon_sy(1).png"
},
}
],
"tabBar" : {
"color" : "#CCCCCC",
"borderStyle" : "white",
"backgroundColor" : "#FFFFFF",
"custom" : true,
"list" : [
{
"pagePath" : "pages/index/index",
"text" : "首页",
"iconPath" : "static/tabbar/di_icon_syh.png",
"selectedIconPath" : "static/tabbar/di_icon_sy.png"
},
{
"pagePath" : "pages/shopTransfer/shopTransfer",
"text" : "店铺转让",
"iconPath" : "static/tabbar/di_icon_zrh.png",
"selectedIconPath" : "static/tabbar/di_icon_zr.png"
},
{
"pagePath" : "pages/publish/publish",
"text" : "发布",
"iconPath" : "static/tabbar/di_icon_fb.png",
"selectedIconPath" : "static/tabbar/di_icon_fb.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": [
{
"pagePath": "pages/my/my",
"text": "我的",
"iconPath": "static/tabbar/sy_icon_wdh.png",
"selectedIconPath": "static/tabbar/sy_icon_wd.png"
"name": "", //模式名称
"path": "", //启动页面，必选
"query": "" //启动参数，在页面的onLoad函数里面得到
}
]
},
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"uniIdRouter": {}
}
}
}

86
pages/detail/detail.vue Normal file
View File

@@ -0,0 +1,86 @@
<template>
<view class="detail">
<view class="swiper">
<u-swiper :list="list"></u-swiper>
</view>
<view class="sub-detail u-flex">
<view class="title">
石锅饭铺面转让石锅饭铺面转让石锅饭铺面转
</view>
<view>
<u-grid :col="3">
<u-grid-item>
<view class="grid-text">22</view>
<view class="grid-text">租金</view>
</u-grid-item>
<u-grid-item>
<view class="grid-text">22</view>
<view class="grid-text">转让费</view>
</u-grid-item>
<u-grid-item>
<view class="grid-text">22</view>
<view class="grid-text">面积</view>
</u-grid-item>
</u-grid>
</view>
</view>
<view class="location-detail">
<text>行业：</text>
<text>区域：</text>
<text>地址：</text>
</view>
<view class="seller-shop-detail">
<view class="avator">
<u-avatar :src="src"></u-avatar>
<u-cell title="张先生" label="123456"></u-cell>
</view>
<!-- <text>美食杂货店是一个主打食品和日用杂货的淘宝2222222222222222</text> -->
<u-cell title="店铺介绍" label="美食杂货店是一个主打食品和日用杂货的淘宝222222222222222222222美食杂货店是一个主打食品和日用杂货的淘宝美食杂货店是一个主打食品和日用杂货的淘宝"></u-cell>
</view>
</view>
</template>
<script>
export default {
props:{},
data() {
return {
list:'',
}
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.detail{
// background-color: #F8F8F8;
height: 100%;
}
.swiper {
}
.title{
padding: 20rpx;
background-color: #fff;
}
.location-detail{
display: flex;
margin-top: 20rpx;
background-color: #fff;
flex-direction: column;
padding-left: 16rpx;
line-height: 33px;
font-size: 15px;
}
.seller-shop-detail{
margin-top: 50rpx;
}
.avator{
display: flex;
flex-direction: row;
align-items: center;
margin-left: 16rpx;
}
</style>

38
pages/index/index.vue
View File

@@ -6,6 +6,8 @@
prefixIconStyle="font-size: 22px;color: #909399;margin-left:30rpx" readonly>
</u-input>
</view>
<InputAndSwiper></InputAndSwiper>
<TabBar :current-page="0"></TabBar>
</view>
<h1>测试</h1>
</view>
@@ -14,9 +16,7 @@
<script>
export default {
data() {
return {
}
return {}
},
onLoad() {
@@ -26,34 +26,8 @@
}
}
</script>
<style lang="scss">
// 搜索框样式
.search_box {
background: linear-gradient(135deg, #12CA64 0%, #1ACA67 100%);
.search_box_border {
width: 94.6%;
height: 124rpx;
background: linear-gradient(320deg, #36E182 0%, #26DD76 100%, #26DD76 100%);
margin: 0 auto;
box-shadow: 0 -1px 3px 0 #31B96D;
border-radius: 38rpx 38rpx 0 0;
.u-border {
border: none;
padding-top: 16px !important;
.u-input__content {
height: 64rpx;
border-radius: 32rpx;
background-color: #fff;
.u-input__content__field-wrapper__field {
font-size: 26rpx !important;
}
}
}
}
<style>
page {
background-color: #F8F8F8;
}
</style>

16
pages/my/my.vue
View File

@@ -1,12 +1,14 @@
<template>
<view class="my">
<view>
<view class="my">
<view class="profile">
<image src="../../static/img/wo_bj_ll@2x.png" mode="aspectFit" class="profile-bgi"></image>
<view class="avator">
<u-avatar :src="src"></u-avatar>
</view>
<view class="username">用户名</view>
<view class="account">账号:132123123132</view>
<view class="username">{{username}}</view>
<view class="account">账号:{{account}}</view>
</view>
<view class="publish">
<u-cell-group>
@@ -17,8 +19,8 @@
<u-cell icon="integral-fill" title="成功合伙人" is-link="true"></u-cell>
</u-cell-group>
</view>
</view>
<TabBar :current-page="4"></TabBar>
</view>
</template>
@@ -26,7 +28,9 @@
export default {
data() {
return {
src: 'https://cdn.uviewui.com/uview/album/2.jpg'
src: 'https://cdn.uviewui.com/uview/album/2.jpg',
account:'11111111',
username:'用户名'
}
},
onLoad() {

23
pages/publish/publish.vue Normal file
View File

@@ -0,0 +1,23 @@
<template>
<view>
发布
<TabBar :current-page="2" />
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>

23
pages/shopAddress/shopAddress.vue Normal file
View File

@@ -0,0 +1,23 @@
<template>
<view>
找店地址
<TabBar :current-page="3"></TabBar>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>

23
pages/shopTransfer/shopTransfer.vue Normal file
View File

@@ -0,0 +1,23 @@
<template>
<view>
店铺转让
<TabBar :current-page="1"></TabBar>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>

BIN
static/tabbar/di_icon_dz.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
static/tabbar/di_icon_dzh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
static/tabbar/di_icon_fb.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.0 KiB

BIN
static/tabbar/di_icon_fb@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
static/tabbar/di_icon_sy.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1008 B

BIN
static/tabbar/di_icon_syh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 987 B

BIN
static/tabbar/di_icon_wd.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1017 B

BIN
static/tabbar/di_icon_wdh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 987 B

BIN
static/tabbar/di_icon_zr.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
static/tabbar/di_icon_zrh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
static/tabbar/sy_icon_sy(1).png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

BIN
static/tabbar/sy_icon_syh.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 706 B

BIN
static/tabbar/sy_icon_wd.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 2.0 KiB

BIN
static/tabbar/sy_icon_wdh.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.5 KiB

1122
utils/qqmap-wx-jssdk.js Normal file
View File

File diff suppressed because it is too large Load Diff

1
utils/qqmap-wx-jssdk.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long