hly
/
universal-wechat-uniapp-241007
generated from hly/uniapp-shop-templates
1
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

粉丝

master
Bobi 8 months ago
parent
6fd74bf0a0
commit
ed94f1796a
7 changed files with 379 additions and 195 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +26
    -5
      components/list/dynamic/dynamicItem.vue
  2. +126
    -94
      components/list/dynamic/userHeadItem.vue
  3. +38
    -11
      components/user/createDetailPopup.vue
  4. +6
    -5
      pages/index/center.vue
  5. +15
    -38
      pages/index/index.vue
  6. +28
    -3
      pages_order/car/carList.vue
  7. +140
    -39
      pages_order/components/list/cart/cartItem.vue

+ 26
- 5
components/list/dynamic/dynamicItem.vue View File

@ -6,20 +6,36 @@
<daynamicInfo :item="item" /> <daynamicInfo :item="item" />
<view class="bottom"> <view class="bottom">
<!-- 浏览 -->
<view class="browse"> <view class="browse">
{{ item.isBrowse }}浏览
{{ item.isBrowse }}
<view class="bontt">
<uv-icon name="eye-fill"></uv-icon>
</view>
</view> </view>
<!-- 评论 -->
<view class="browse"> <view class="browse">
{{ item.isComment }}条评论
{{ item.isComment }}
<view class="bontt">
<uv-icon name="chat-fill"></uv-icon>
</view>
</view> </view>
<view class="browse"> <view class="browse">
点赞
22
<view class="bontt">
<uv-icon name="thumb-up-fill"></uv-icon>
</view>
<!-- 点赞 -->
</view> </view>
<view class="browse"> <view class="browse">
<view class="icon">
0
<view class="bontt">
<uv-icon name="attach"></uv-icon> <uv-icon name="attach"></uv-icon>
</view> </view>
分享
</view> </view>
<callPhone :phone="item.phone" :sexName="item.sex" /> <callPhone :phone="item.phone" :sexName="item.sex" />
</view> </view>
@ -59,10 +75,15 @@
.browse { .browse {
display: flex; display: flex;
justify-content: center;
align-items: center;
margin: 0rpx 30rpx; margin: 0rpx 30rpx;
color: rgb(132, 132, 132); color: rgb(132, 132, 132);
margin-left: 10rpx; margin-left: 10rpx;
} }
.bontt{
margin: 0rpx 5rpx;
}
} }
} }
</style> </style>

+ 126
- 94
components/list/dynamic/userHeadItem.vue View File

@ -1,49 +1,64 @@
<template> <template>
<view class="box" :style="{'--sexcolor' : sex[item.sex].color}">
<view class="headPortraitimg">
<image :src="item.userImage" @click.stop="previewImage([item.userImage])" mode="aspectFill"></image>
<view class="o">
<view class="indee">
<view class="k">
#{{item.classId_dictText}}
</view>
</view> </view>
<view class="YaoduUniversalWall">
<view class="heide">
<view class="username text-ellipsis">
{{ item.userName }}
</view>
<view class="inde" v-if="item.sex">
<!-- 性别 -->
{{ item.sex }}
</view>
<view class="inde" v-if="item.yearDate">
<!-- 年份 -->
{{ item.yearDate }}
</view>
<view class="inde" v-if="item.addId">
<!-- 地址 -->
{{ item.addId }}
</view>
<view class="inde">
#{{item.classId_dictText}}
</view>
<view class="authentication" v-if="item.isContent">
<!-- 个人认证 -->
{{ item.isContent }}
</view>
<view class="box" :style="{'--sexcolor' : sex[item.sex].color}">
<!-- <view class="indee">
#{{item.classId_dictText}}
</view> -->
<view class="headPortraitimg">
<image :src="item.userImage" @click.stop="previewImage([item.userImage])" mode="aspectFill"></image>
</view> </view>
<view class="Times">
<view class="TimeMonth">
<!-- 10-08 -->
{{ item.createTime }}发布
<view class="YaoduUniversalWall">
<view class="heide">
<view class="username text-ellipsis">
{{ item.userName }}
</view>
<view class="inde" v-if="item.sex">
<!-- 性别 -->
{{ item.sex }}
</view>
<view class="inde" v-if="item.yearDate">
<!-- 年份 -->
{{ item.yearDate }}
</view>
<view class="inde" v-if="item.addId">
<!-- 地址 -->
{{ item.addId }}
</view>
<!-- 分类 -->
<view class="authentication" v-if="item.isContent">
<!-- 个人认证 -->
{{ item.isContent }}
</view>
</view> </view>
<!-- <view class="Month">
<view class="Times">
<view class="TimeMonth">
<!-- 10-08 -->
{{ item.createTime }}发布
</view>
<!-- <view class="Month">
12:34 12:34
</view> --> </view> -->
</view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
@ -65,78 +80,95 @@
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.box {
display: flex;
align-items: center;
.headPortraitimg {
width: 100rpx;
height: 100rpx;
border-radius: 15rpx;
overflow: hidden;
image {
width: 100%;
height: 100%;
.o {
.indee{
.k{
display: flex;
justify-content: flex-end;
margin-top: -30rpx;
color:gold;
} }
} }
.box {
display: flex;
align-items: center;
.YaoduUniversalWall {
padding: 0rpx 10rpx;
.indee {}
.username {
max-width: 200rpx;
}
.headPortraitimg {
.heide {
display: flex;
justify-content: center;
align-items: center;
}
width: 100rpx;
height: 100rpx;
border-radius: 15rpx;
overflow: hidden;
.inde {
display: flex;
justify-content: center;
align-items: center;
padding: 0rpx 10rpx;
margin: 0rpx 5rpx;
font-size: 20rpx;
height: 30rpx;
color: white;
// background-color: rgb(124, 136, 242);
background-color: var(--sexcolor);
border-radius: 7rpx;
flex-shrink: 0;
image {
width: 100%;
height: 100%;
}
} }
.authentication {
display: flex;
justify-content: center;
align-items: center;
padding: 0rpx 10rpx;
margin: 0rpx 5rpx;
font-size: 20rpx;
height: 34rpx;
.YaoduUniversalWall {
padding: 0rpx 10rpx; padding: 0rpx 10rpx;
color: white;
background-color: #ffd036;
border-radius: 7rpx;
flex-shrink: 0;
}
.Times {
display: flex;
padding: 5rpx 0rpx;
font-size: 20rpx;
margin-top: 10rpx;
.username {
max-width: 200rpx;
}
.Month {
margin: 0rpx 15rpx;
.heide {
display: flex;
justify-content: center;
align-items: center;
} }
.inde {
display: flex;
justify-content: center;
align-items: center;
padding: 0rpx 10rpx;
margin: 0rpx 5rpx;
font-size: 20rpx;
height: 30rpx;
color: white;
// background-color: rgb(124, 136, 242);
background-color: var(--sexcolor);
border-radius: 7rpx;
flex-shrink: 0;
}
.authentication {
display: flex;
justify-content: center;
align-items: center;
padding: 0rpx 10rpx;
margin: 0rpx 5rpx;
font-size: 20rpx;
height: 34rpx;
padding: 0rpx 10rpx;
color: white;
background-color: #ffd036;
border-radius: 7rpx;
flex-shrink: 0;
}
.Times {
display: flex;
padding: 5rpx 0rpx;
font-size: 20rpx;
margin-top: 10rpx;
.Month {
margin: 0rpx 15rpx;
}
}
} }
} }
} }
</style> </style>

+ 38
- 11
components/user/createDetailPopup.vue View File

@ -1,7 +1,25 @@
<template> <template>
<view> <view>
<view class="createDetail" @click="open">
<uv-icon size="40rpx" color="#fff" name="plus"></uv-icon>
<view class="createDetail">
<view @click="open">
<uv-icon size="40rpx" color="#fff" name="plus"></uv-icon>
</view>
<!-- 悬浮图标 -->
<view>
<button @click="$utils.navigateTo('/pages_order/mine/promotion')">
<uv-icon size="40rpx"
color="#fff"
name="server-man"></uv-icon>
</button>
</view>
<view>
<button>
<uv-icon size="40rpx"
color="#fff"
name="question-circle"></uv-icon>
</button>
</view>
</view> </view>
<uv-popup ref="createDetailPopup" :round="30"> <uv-popup ref="createDetailPopup" :round="30">
@ -64,17 +82,26 @@
<style scoped lang="scss"> <style scoped lang="scss">
.createDetail { .createDetail {
position: fixed; position: fixed;
top: 70vh;
top: 60vh;
right: 50rpx; right: 50rpx;
width: 100rpx;
height: 100rpx;
background-color: $uni-color;
border-radius: 50rpx;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0 0 10rpx 10rpx rgba(#000, 0.1);
z-index: 999; z-index: 999;
button{
all : unset;
}
button::after{
all : unset;
}
&>view{
width: 100rpx;
height: 100rpx;
background-color: $uni-color;
border-radius: 50rpx;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0 0 10rpx 10rpx rgba(#000, 0.1);
margin-bottom: 30rpx;
}
} }
.createDetailPopup { .createDetailPopup {


+ 6
- 5
pages/index/center.vue View File

@ -1,7 +1,6 @@
<template> <template>
<view class="page"> <view class="page">
<view class="beijin"> <view class="beijin">
<view class=" profile"> <view class=" profile">
<view class="o"> <view class="o">
<view class="headImage"> <view class="headImage">
@ -44,7 +43,7 @@
<view class="digit"> <view class="digit">
<uv-icon <uv-icon
size="40rpx" size="40rpx"
color="#fff"
color="#black"
name="grid"></uv-icon> name="grid"></uv-icon>
</view> </view>
<view class="fans"> <view class="fans">
@ -192,16 +191,18 @@
<style scoped lang="scss"> <style scoped lang="scss">
.page { .page {
.beijin { .beijin {
background: linear-gradient(to bottom, rgb(85, 94, 123), rgb(45, 51, 73));
// background: linear-gradient(to bottom, rgb(85, 94, 123), rgb(45, 51, 73));
background: linear-gradient($uni-color, #fff);
background-color: black; background-color: black;
color: white;
color: black;
.profile { .profile {
padding: 40rpx; padding: 40rpx;
padding-top: 160rpx; padding-top: 160rpx;
.box { .box {
padding: 5rpx 10rpx;
padding: 0rpx 10rpx;
display: flex; display: flex;
align-items: center; align-items: center;
text-align: center; text-align: center;


+ 15
- 38
pages/index/index.vue View File

@ -112,36 +112,29 @@
@click="tabsClick"></uv-tabs> @click="tabsClick"></uv-tabs>
</view> </view>
<!-- 动态列表 --> <!-- 动态列表 -->
<dynamicItem
:key="index"
v-for="(item, index) in list"
:item="item"
@click="$utils.navigateTo('/pages_order/post/postDetail?id=' + item.id)"
/>
<view
class="dynamicList"
:style="{backgroundColor: queryParams.classId ? '' : 'wheat'}">
<dynamicItem
:key="index"
v-for="(item, index) in list"
:item="item"
@click="$utils.navigateTo('/pages_order/post/postDetail?id=' + item.id)"
/>
</view>
</view> </view>
<createDetailPopup/> <createDetailPopup/>
<certificationPopup ref="certificationPopup"/> <certificationPopup ref="certificationPopup"/>
<sharePopup ref="sharePopup"/> <sharePopup ref="sharePopup"/>
<customerServicePopup <customerServicePopup
:title="headinfo.details" :title="headinfo.details"
:image="headinfo.kefu" :image="headinfo.kefu"
ref="customerServicePopup"/> ref="customerServicePopup"/>
<view class="customerService">
<button>
<uv-icon size="40rpx"
color="#fff"
name="server-man"></uv-icon>
</button>
</view>
<PrivacyAgreementPoup /> <PrivacyAgreementPoup />
<tabber select="0" /> <tabber select="0" />
</view> </view>
</template> </template>
@ -291,6 +284,7 @@
<style scoped lang="scss"> <style scoped lang="scss">
.page{ .page{
position: relative; position: relative;
} }
image{ image{
width: 100%; width: 100%;
@ -374,6 +368,7 @@
z-index: 9; z-index: 9;
overflow: hidden; overflow: hidden;
.life { .life {
display: flex; display: flex;
text-align: center; text-align: center;
padding: 10rpx 0; padding: 10rpx 0;
@ -398,26 +393,8 @@
} }
} }
} }
}
.customerService{
position: fixed;
top: calc(70vh + 120rpx);
right: 50rpx;
width: 100rpx;
height: 100rpx;
background-color: $uni-color;
border-radius: 50rpx;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0 0 10rpx 10rpx rgba(#000, 0.1);
z-index: 999;
overflow: hidden;
button{
// background-color: ;
all : unset;
.dynamicList{
padding-top: 10rpx;
} }
} }

+ 28
- 3
pages_order/car/carList.vue View File

@ -1,20 +1,34 @@
<template> <template>
<view class="page pageList"> <view class="page pageList">
<navbar title="景点" bgColor="#5baaff" color="#fff" leftClick @leftClick="$utils.navigateBack" />
<navbar title="找车" bgColor="#5baaff" color="#fff" leftClick @leftClick="$utils.navigateBack" />
<view class="top-bg"></view> <view class="top-bg"></view>
<view style="padding: 10rpx 30rpx 0 30rpx;"> <view style="padding: 10rpx 30rpx 0 30rpx;">
<uv-search bgColor="#fff" @search="getData" :showAction="false" searchIconSize="30rpx" <uv-search bgColor="#fff" @search="getData" :showAction="false" searchIconSize="30rpx"
placeholder="请输入搜索关键字..." v-model="queryParams.title"></uv-search> placeholder="请输入搜索关键字..." v-model="queryParams.title"></uv-search>
</view> </view>
<view class="LabelOptions">
<uv-tabs :list="tabs"
:activeStyle="{color : '#fff', fontWeight : 900}"
:inactiveStyle="{color : '#eee'}"
lineColor="#fff"
lineHeight="8rpx"
lineWidth="50rpx"
:scrollable="false"
@click="tabsClick"></uv-tabs>
</view>
<view class="">
<!-- <view class="">
<screenRen :isArea="false" @clickItem="clickItem" /> <screenRen :isArea="false" @clickItem="clickItem" />
</view>
</view> -->
<view class="list"> <view class="list">
<cartItem :key="index" v-for="(item, index) in list" :item="item" <cartItem :key="index" v-for="(item, index) in list" :item="item"
@click="$utils.navigateTo('/pages_order/car/carListDetail?id=' + item.id)" /> @click="$utils.navigateTo('/pages_order/car/carListDetail?id=' + item.id)" />
</view> </view>
</view> </view>
</template> </template>
@ -32,6 +46,14 @@
data() { data() {
return { return {
mixinsListApi: 'getCatPage', mixinsListApi: 'getCatPage',
tabs : [
{
name : "车找人",
},
{
name : "人找车",
},
],
} }
}, },
methods: { methods: {
@ -54,6 +76,9 @@
.list { .list {
padding: 0 20rpx; padding: 0 20rpx;
} }
.LabelOptions{
position: relative;
}
} }
.top-bg { .top-bg {


+ 140
- 39
pages_order/components/list/cart/cartItem.vue View File

@ -1,9 +1,9 @@
<template> <template>
<view class="item" @click="$emit('click')"> <view class="item" @click="$emit('click')">
<image :src="item.imageTitle"
<!-- <image :src="item.imageTitle"
@click.stop="previewImage([item.imageTitle])" @click.stop="previewImage([item.imageTitle])"
mode="aspectFill"></image>
<view class="text">
mode="aspectFill"></image> -->
<!-- <view class="text">
<view class="title"> <view class="title">
{{ item.title }} {{ item.title }}
</view> </view>
@ -26,8 +26,62 @@
:phone="item.phone" :phone="item.phone"
title="司机"/> title="司机"/>
</view> </view>
</view> -->
<view class="zhaoche">
<view class="touxinag">
</view>
<view class="chezhaoren">
<uv-icon name="car-fill" color="#2979ff" size="50"></uv-icon>
车找人 {{item.num}}空位
</view>
<view class="lianxi">
<uv-icon name="phone-fill" color="#fff" size="40"></uv-icon>
联系
</view>
</view>
<view class="address">
<view class="shi">
始
</view>
<view class="zhi">
{{item.startAddress}}
</view>
</view>
<view class="ads">
<view class="zhon">
终
</view>
<view class="zhi">
{{item.endAddress}}
</view>
</view>
<view class="time">
出发时间：{{item.startTime}}
</view>
<view class="chexing">
车型：suv
</view>
<view class="chezhuxinxi">
<view class="sex">
<uv-icon name="man" color="#2979ff" size="28"></uv-icon>
</view>
<view class="name">
{{item.createBy}}
</view> </view>
</view> </view>
</view>
</template> </template>
<script> <script>
@ -41,7 +95,7 @@
}; };
}, },
methods: { methods: {
callPhone(){
callPhone() {
uni.makePhoneCall({ uni.makePhoneCall({
phoneNumber: this.item.phone phoneNumber: this.item.phone
}) })
@ -52,57 +106,104 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.item { .item {
height: 220rpx;
height: 330rpx;
width: 100%; width: 100%;
background-color: #fff; background-color: #fff;
overflow: hidden; overflow: hidden;
border-radius: 10rpx; border-radius: 10rpx;
color: #777; color: #777;
display: flex;
// display: flex;
font-size: 24rpx; font-size: 24rpx;
margin: 30rpx 0; margin: 30rpx 0;
position: relative; position: relative;
image {
width: 50%;
height: 100%;
}
.text {
.zhaoche {
width: 100%;
margin: 20rpx 10rpx;
display: flex; display: flex;
flex-direction: column;
padding: 16rpx;
width: 50%;
justify-content: space-between;
.touxinag {
height: 70rpx;
width: 70rpx;
background-color: black;
.title {
font-size: 30rpx;
font-weight: 600;
color: #000;
} }
.createBy {
.chezhaoren {
display: flex; display: flex;
margin-top: auto;
line-height: 40rpx;
justify-content: space-between;
justify-content: center;
align-items: center;
margin-right: 230rpx;
border: 1rpx solid $uni-color;
height: 40rpx;
padding: 16rpx;
color:$uni-color ;
}
&>view {
display: flex;
align-items: center;
justify-content: center;
}
.phone{
background-color: rgba($uni-color, 0.2);
color: $uni-color;
padding: 8rpx 16rpx;
border-radius: 10rpx;
margin-left: auto;
image{
width: 20rpx;
height: 20rpx;
}
}
.lianxi {
color: #fff;
background-color: $uni-color;
height: 70rpx;
display: flex;
justify-content: center;
align-items: center;
width: 120rpx;
border-radius: 15rpx;
margin: 0rpx 20rpx;
}
}
.address{
display: flex;
margin: 0rpx 10rpx;
.shi{
margin-right: 10rpx;
background-color:$uni-color ;
color: white;
width: 30rpx;
height: 30rpx;
padding: 5rpx;
border-radius: 50%;
text-align: center;
}
.zhi{
margin-top: 5rpx;
} }
} }
.ads{
display: flex;
margin: 10rpx 10rpx;
.zhon{
margin-right: 10rpx;
background-color:red;
color: white;
width: 30rpx;
height: 30rpx;
padding: 5rpx;
border-radius: 50%;
text-align: center;
}
}
.time{
margin: 10rpx 10rpx;
}
.chexing{
margin: 10rpx 10rpx;
}
.chezhuxinxi{
display: flex;
margin: 10rpx 10rpx;
.sex{
margin-top: 5rpx;
}
.name{
margin-left: 8rpx;
}
}
} }
</style> </style>

Write Preview
Loading…
Cancel
Save