jiazhipeng
11 months ago
8 changed files with 339 additions and 20 deletions
@ -0,0 +1,117 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/login/title.png" mode="" class="title-img"></image> |
|||
|
|||
<view class="item flex-between" style="margin-top: 83rpx;"> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/login/phone.png" mode="" class="icon"></image> |
|||
<input type="text" v-model="form.username" placeholder="请输入手机号"/> |
|||
</view> |
|||
|
|||
<view class="item flex-between"> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/login/code.png" mode="" class="icon"></image> |
|||
<input type="text" v-model="form.captchaCodeId" placeholder="请输入图形验证码"/> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/topImg.png" mode="" class="code-img"></image> |
|||
</view> |
|||
|
|||
<view class="item flex-between"> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/login/password.png" mode="" class="icon"></image> |
|||
<input type="text" :password="showPassword" v-model="form.password" placeholder="请输入密码"/> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/login/eye.png" mode="" class="eye-img" @click="showPassword = false" v-if="showPassword"></image> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/login/closeEye.png" mode="" class="eye-img" @click="showPassword = true" v-else></image> |
|||
</view> |
|||
|
|||
<view class="btn" @click="login"> |
|||
立即登录 |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
form: { |
|||
username: '17717512304', |
|||
captchaCodeId: '558092', |
|||
password: '512304' |
|||
}, |
|||
showPassword: true |
|||
} |
|||
}, |
|||
onShow() { |
|||
this.Post({},'/api/Merchants/get_graphic').then(res => { |
|||
console.log(res) |
|||
}) |
|||
}, |
|||
methods: { |
|||
login() { |
|||
this.Post(this.form,'/api/Merchants/login_member').then(res => { |
|||
console.log(res) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
width: 100vw; |
|||
height: 100vh; |
|||
background-image: url('https://static.ticket.sz-trip.com/tourGuide/images/login/bg.png'); |
|||
background-size: 100% 100%; |
|||
padding-top: 428rpx; |
|||
} |
|||
|
|||
.title-img { |
|||
display: block; |
|||
margin: auto; |
|||
width: 336.67rpx; |
|||
height: 54rpx; |
|||
} |
|||
|
|||
.item { |
|||
width: 587rpx; |
|||
height: 80rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 40rpx; |
|||
margin: 32rpx auto 0; |
|||
padding: 0 26rpx; |
|||
|
|||
.icon { |
|||
width: 26.67rpx; |
|||
height: 26.67rpx; |
|||
margin-right: 12rpx; |
|||
} |
|||
|
|||
input { |
|||
flex: 1; |
|||
font-weight: 500; |
|||
font-size: 25rpx; |
|||
color: #ABABAB; |
|||
} |
|||
|
|||
.code-img { |
|||
width: 153rpx; |
|||
height: 55rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.eye-img { |
|||
width: 26.67rpx; |
|||
height: 26.67rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.btn { |
|||
width: 547rpx; |
|||
line-height: 80rpx; |
|||
background: #96684F; |
|||
border-radius: 40rpx; |
|||
margin: 100rpx auto 0; |
|||
font-weight: bold; |
|||
font-size: 35rpx; |
|||
color: #FFFFFF; |
|||
text-align: center; |
|||
} |
|||
</style> |
|||
@ -1,8 +1,130 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="top-box flex-between"> |
|||
<view class="top-left"> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/topImg.png" mode="" class="avatar"></image> |
|||
<view class="flex-column"> |
|||
<view class="top-title">苏小小</view> |
|||
<view class="top-subtitle">大师级导游</view> |
|||
</view> |
|||
</view> |
|||
<view class="top-right"> |
|||
个人信息 |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/user/rightBlack.png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="box"> |
|||
<view v-for="(item,index) in list" :key="index" class="flex-between" @click="gotoPath(item.path)"> |
|||
<view class="title">{{item.title}}</view> |
|||
<image src="https://static.ticket.sz-trip.com/tourGuide/images/user/rightGray.png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
list: [ |
|||
{ |
|||
title: '我的消息', |
|||
path: '/subPackages/user/myNews' |
|||
}, |
|||
{ |
|||
title: '我的订单', |
|||
path: '' |
|||
}, |
|||
{ |
|||
title: '账号密码', |
|||
path: '' |
|||
} |
|||
] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
min-height: 100vh; |
|||
background: #F5F5F5; |
|||
padding: 57rpx 26rpx 0; |
|||
} |
|||
|
|||
.top-box { |
|||
height: 169rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 13rpx; |
|||
padding: 0 34rpx; |
|||
|
|||
.top-left { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
.avatar { |
|||
width: 120rpx; |
|||
height: 120rpx; |
|||
border-radius: 50%; |
|||
margin-right: 15rpx; |
|||
} |
|||
|
|||
view { |
|||
padding: 15rpx 0; |
|||
justify-content: space-between; |
|||
|
|||
.top-title { |
|||
font-weight: bold; |
|||
font-size: 32rpx; |
|||
color: #000000; |
|||
} |
|||
|
|||
.top-subtitle { |
|||
font-weight: 500; |
|||
font-size: 25rpx; |
|||
color: #000000; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.top-right { |
|||
font-weight: 500; |
|||
font-size: 25rpx; |
|||
color: #100E0E; |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
image { |
|||
width: 11.33rpx; |
|||
height: 20rpx; |
|||
margin-left: 19rpx; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.box { |
|||
margin-top: 28rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 13rpx; |
|||
|
|||
.flex-between { |
|||
height: 106rpx; |
|||
padding: 0 26rpx; |
|||
|
|||
.title { |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #000000; |
|||
} |
|||
|
|||
image { |
|||
width: 11.33rpx; |
|||
height: 20rpx; |
|||
} |
|||
} |
|||
.flex-between:not(:first-child) { |
|||
border-top: 1rpx solid #D8D8D8; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,67 @@ |
|||
<template> |
|||
<view class="bg"> |
|||
<view class="item" v-for="(item,index) in list" :key="index"> |
|||
<view class="title"> |
|||
{{item.title}} <span v-if="!item.isRead"></span> |
|||
</view> |
|||
<view class="time">{{item.time}}</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
list: [ |
|||
{ |
|||
title: '导游信息审核通知', |
|||
time: '2024-11-23', |
|||
isRead: false |
|||
}, |
|||
{ |
|||
title: '导游信息审核通知', |
|||
time: '2024-11-23', |
|||
isRead: true |
|||
} |
|||
] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
min-height: 100vh; |
|||
background: #F5F5F5; |
|||
padding-top: 50rpx; |
|||
} |
|||
|
|||
.item { |
|||
padding: 26rpx 20rpx 20rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 13rpx; |
|||
width: 697rpx; |
|||
margin: 0 auto 21rpx; |
|||
|
|||
.title { |
|||
font-weight: 500; |
|||
font-size: 32rpx; |
|||
color: #000000; |
|||
|
|||
span { |
|||
width: 11rpx; |
|||
height: 11rpx; |
|||
background: #E5131B; |
|||
border-radius: 50%; |
|||
} |
|||
} |
|||
|
|||
.time { |
|||
font-weight: 500; |
|||
font-size: 25rpx; |
|||
color: #717171; |
|||
margin-top: 22rpx; |
|||
} |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue