新增页面
This commit is contained in:
44
pages/user/feedback.vue
Normal file
44
pages/user/feedback.vue
Normal file
@@ -0,0 +1,44 @@
|
||||
<script setup>
|
||||
import { onLoad } from "@dcloudio/uni-app"
|
||||
// import mySwiper from "@/components/mySwiper.vue"
|
||||
import {ref,onMounted,nextTick} from "vue"
|
||||
import {useStore} from '@/store/index.js'
|
||||
import api from "@/api/index.js"
|
||||
</script>
|
||||
<template>
|
||||
<view class="feedbackBox">
|
||||
<view class="writeBox">
|
||||
<textarea class="textarea" v-model="txt"></textarea>
|
||||
</view>
|
||||
<view class="btn-part">
|
||||
<view class="btn">提交</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.feedbackBox{
|
||||
padding: 20rpx;
|
||||
.writeBox{
|
||||
border: 2rpx solid #e2e2e2;
|
||||
border-radius: 10rpx;
|
||||
textarea{
|
||||
width: 100%;
|
||||
padding: 20rpx;
|
||||
}
|
||||
}
|
||||
.btn-part{
|
||||
position: fixed;
|
||||
bottom: 40rpx;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
.btn{
|
||||
display: inline-block;
|
||||
background-color: #26758d;
|
||||
color: white;
|
||||
padding: 20rpx 40rpx;
|
||||
width: 50%;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@@ -77,21 +77,127 @@
|
||||
url:"/pages/login/login"
|
||||
})
|
||||
}
|
||||
function toDetail(type) {
|
||||
let url = ''
|
||||
switch(type){
|
||||
case 1:
|
||||
url= ' '
|
||||
break;
|
||||
case 2: // 我的收藏
|
||||
url= './star'
|
||||
break;
|
||||
case 3: // 设置
|
||||
url= './setting'
|
||||
break;
|
||||
case 4: // 问题反馈
|
||||
url= './feedback'
|
||||
break;
|
||||
default:
|
||||
url= ' '
|
||||
break;
|
||||
}
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}
|
||||
function toUserInfo() {
|
||||
uni.navigateTo({
|
||||
url:"/pages/user/userInfo"
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<view class="user-box page-box">
|
||||
<view class="userinfo-box">
|
||||
<view class="userinfo-box" @tap="toUserInfo">
|
||||
<image :src="is_login?avatar:'../../static/avatar.png'" mode=""></image>
|
||||
<view class="">
|
||||
<view class="" style="font-weight: 900;font-size: 40rpx;">
|
||||
{{is_login?userinfo.nickname:'未登录'}}
|
||||
</view>
|
||||
<uni-icons style="position: absolute;right:20rpx;top: 40%;" v-if="is_login" type="forward" color="white" size="20"></uni-icons>
|
||||
</view>
|
||||
<view class="btn-box" @tap="toLogin" v-if="!is_login">
|
||||
<view class="btn">登录</view>
|
||||
</view>
|
||||
<view class="row-box" v-else>
|
||||
<view class="rb-card" @tap="toDetail(1)" style="margin-bottom: 10px;">
|
||||
<!-- <view class="rbc-title">手术历程</view> -->
|
||||
<view class="rbc-content rbc-content-box">
|
||||
<view class="rbc-content-row rbc-content-left">
|
||||
<uni-icons type="calendar" color="gray" size="30"></uni-icons>
|
||||
<view>已完成事项</view>
|
||||
</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="notification" color="gray" size="30"></uni-icons>
|
||||
<view>未完成事项</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(2)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="star" color="gray" size="30"></uni-icons>
|
||||
我的收藏</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(3)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="gear" color="gray" size="30"></uni-icons>
|
||||
设置</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(4)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="chatbubble" color="gray" size="30"></uni-icons>
|
||||
问题反馈</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.rbc-content-left-box{
|
||||
uni-icons{
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.row-box{
|
||||
padding: 20rpx 0;
|
||||
.rb-card{
|
||||
padding: 20rpx;
|
||||
background: white;
|
||||
.rbc-title{
|
||||
|
||||
}
|
||||
.rbc-content-box{
|
||||
margin-top: 10rpx;
|
||||
.rbc-content-row{
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
// padding: 40rpx 20rpx;
|
||||
// box-shadow: 10rpx 10rpx 10rpx #cdcdcd;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.rbc-content{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-box{
|
||||
text-align: center;
|
||||
margin-top: 40rpx;
|
||||
@@ -105,6 +211,7 @@
|
||||
}
|
||||
}
|
||||
.userinfo-box{
|
||||
position: relative;
|
||||
image{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
@@ -117,5 +224,8 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 40rpx 20rpx;
|
||||
}
|
||||
.user-box{
|
||||
background: #f6f6f6;
|
||||
}
|
||||
</style>
|
160
pages/user/setting.vue
Normal file
160
pages/user/setting.vue
Normal file
@@ -0,0 +1,160 @@
|
||||
<script setup>
|
||||
import { onLoad } from "@dcloudio/uni-app"
|
||||
// import mySwiper from "@/components/mySwiper.vue"
|
||||
import {ref,onMounted,nextTick} from "vue"
|
||||
import {useStore} from '@/store/index.js'
|
||||
import api from "@/api/index.js"
|
||||
onLoad(() => {
|
||||
// console.log(useStore.userInfo)
|
||||
userinfo.value = JSON.parse(uni.getStorageSync('userInfo'))
|
||||
// console.log(userinfo.value)
|
||||
avatar.value = uni.getStorageSync('avatarUrl')
|
||||
})
|
||||
const userinfo = ref(null)
|
||||
const avatar = ref(null)
|
||||
// 方法
|
||||
function toDetail(type) {
|
||||
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<view class="userInfoBox page-box page-bg-gray">
|
||||
<view class="row-box">
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<!-- <uni-icons type="person" color="gray" size="26"></uni-icons> -->
|
||||
用户协议</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<!-- <uni-icons type="phone" color="gray" size="26"></uni-icons> -->
|
||||
隐私政策摘要</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<!-- <uni-icons type="calendar" color="gray" size="26"></uni-icons> -->
|
||||
个人信息手机清单</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<!-- <uni-icons type="paperplane" color="gray" size="26"></uni-icons> -->
|
||||
关于我们</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<!-- <uni-icons type="paperplane" color="gray" size="26"></uni-icons> -->
|
||||
退出账号</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.avatar-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
padding: 20rpx 0;
|
||||
background: #26758d;
|
||||
image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.rbc-content-right{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: white;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.rbc-content-left-box{
|
||||
uni-icons{
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.row-box{
|
||||
padding: 20rpx 0;
|
||||
.rb-card{
|
||||
padding: 20rpx;
|
||||
background: white;
|
||||
margin-bottom: 2rpx;
|
||||
.rbc-title{
|
||||
|
||||
}
|
||||
.rbc-content-box{
|
||||
margin-top: 10rpx;
|
||||
.rbc-content-row{
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
// padding: 40rpx 20rpx;
|
||||
// box-shadow: 10rpx 10rpx 10rpx #cdcdcd;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.rbc-content{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-box{
|
||||
text-align: center;
|
||||
margin-top: 40rpx;
|
||||
.btn{
|
||||
display: inline-block;
|
||||
padding: 10px 20px;
|
||||
background: #e2e2e2;
|
||||
color: #26758d;
|
||||
border-radius: 10px;
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
.userinfo-box{
|
||||
position: relative;
|
||||
image{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
background: white;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
color: white;
|
||||
background-color: #26758d;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 40rpx 20rpx;
|
||||
}
|
||||
.user-box{
|
||||
background: #f6f6f6;
|
||||
}
|
||||
</style>
|
94
pages/user/star.vue
Normal file
94
pages/user/star.vue
Normal file
@@ -0,0 +1,94 @@
|
||||
<script setup>
|
||||
import { onLoad,onPullDownRefresh,onReachBottom } from "@dcloudio/uni-app"
|
||||
// import mySwiper from "@/components/mySwiper.vue"
|
||||
import {ref,onMounted,nextTick} from "vue"
|
||||
import {useStore} from '@/store/index.js'
|
||||
import api from "@/api/index.js"
|
||||
// 生命周期
|
||||
onPullDownRefresh(()=> { // 下拉刷新
|
||||
|
||||
})
|
||||
onReachBottom(() => { // 上滑触底
|
||||
|
||||
})
|
||||
// 变量
|
||||
const list = ref([
|
||||
{
|
||||
id:1,
|
||||
cover_img:'https://gwjxb.oss-cn-chengdu.aliyuncs.com/logo.png',
|
||||
title:'金秋相逢 共叙合作',
|
||||
reading_num:100,
|
||||
content:`
|
||||
新华社北京10月18日电 金秋时节,北京再迎盛会:第三届“一带一路”国际合作高峰论坛隆重举行。
|
||||
春发其华,秋收其实。
|
||||
共建“一带一路”走过了第一个蓬勃十年,正值风华正茂,务当昂扬奋进,奔向下一个金色十年!
|
||||
`
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
cover_img:'https://ms.bdimg.com/pacific/0/pic/1083217647_-478899572.png?x=0&y=0&h=340&w=510&vh=340.00&vw=510.00&oh=340.00&ow=510.00',
|
||||
title:'金秋相逢 共叙合作',
|
||||
reading_num:100,
|
||||
content:`
|
||||
新华社北京10月18日电 金秋时节,北京再迎盛会:第三届“一带一路”国际合作高峰论坛隆重举行。
|
||||
春发其华,秋收其实。
|
||||
共建“一带一路”走过了第一个蓬勃十年,正值风华正茂,务当昂扬奋进,奔向下一个金色十年!
|
||||
`
|
||||
}
|
||||
])
|
||||
// 方法
|
||||
function toDetail(item) {
|
||||
let info = encodeURIComponent(JSON.stringify(item))
|
||||
// console.log(info)
|
||||
uni.navigateTo({
|
||||
url:"/pages/wikipedia/detail?info="+info+"&id="+item.id
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<view class="starBox page-box page-bg-gray">
|
||||
<view class="list-box">
|
||||
<view class="lb-card" v-for="(item,i) in list" @tap="toDetail(item)">
|
||||
<view class="lb-left">
|
||||
<image :src="item.cover_img" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="lb-right">
|
||||
<view class="lb-title">{{item.title}}</view>
|
||||
<view class="lb-content text-ellipsis-1 small-text">{{item.content}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.starBox{
|
||||
|
||||
}
|
||||
.starBox{
|
||||
.list-box{
|
||||
.lb-card{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
border-bottom: 2rpx solid #eaeaea;
|
||||
.lb-left{
|
||||
image{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
}
|
||||
.lb-right{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.lb-title{
|
||||
font-weight: 900;
|
||||
font-size:32rpx ;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
157
pages/user/userInfo.vue
Normal file
157
pages/user/userInfo.vue
Normal file
@@ -0,0 +1,157 @@
|
||||
<script setup>
|
||||
import { onLoad } from "@dcloudio/uni-app"
|
||||
// import mySwiper from "@/components/mySwiper.vue"
|
||||
import {ref,onMounted,nextTick} from "vue"
|
||||
import {useStore} from '@/store/index.js'
|
||||
import api from "@/api/index.js"
|
||||
onLoad(() => {
|
||||
// console.log(useStore.userInfo)
|
||||
userinfo.value = JSON.parse(uni.getStorageSync('userInfo'))
|
||||
console.log(userinfo.value)
|
||||
avatar.value = uni.getStorageSync('avatarUrl')
|
||||
})
|
||||
const userinfo = ref(null)
|
||||
const avatar = ref(null)
|
||||
// 方法
|
||||
function toDetail(type) {
|
||||
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<view class="userInfoBox page-box page-bg-gray">
|
||||
<view class="avatar-box">
|
||||
<image :src="avatar" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="row-box">
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="person" color="gray" size="26"></uni-icons>
|
||||
姓名</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
{{userinfo?.nickname}}
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="phone" color="gray" size="26"></uni-icons>
|
||||
电话</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
{{userinfo?.phone}}
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="calendar" color="gray" size="26"></uni-icons>
|
||||
手术时间</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
2023-10-1
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rb-card" @tap="toDetail(1)">
|
||||
<view class="rbc-content">
|
||||
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
||||
<uni-icons type="paperplane" color="gray" size="26"></uni-icons>
|
||||
手术医院</view>
|
||||
<view class="rbc-content-row rbc-content-right">
|
||||
金山医院
|
||||
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.avatar-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
padding: 20rpx 0;
|
||||
background: #26758d;
|
||||
image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.rbc-content-right{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: white;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.rbc-content-left-box{
|
||||
uni-icons{
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.row-box{
|
||||
padding: 20rpx 0;
|
||||
.rb-card{
|
||||
padding: 20rpx;
|
||||
background: white;
|
||||
margin-bottom: 2rpx;
|
||||
.rbc-title{
|
||||
|
||||
}
|
||||
.rbc-content-box{
|
||||
margin-top: 10rpx;
|
||||
.rbc-content-row{
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
// padding: 40rpx 20rpx;
|
||||
// box-shadow: 10rpx 10rpx 10rpx #cdcdcd;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.rbc-content{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-box{
|
||||
text-align: center;
|
||||
margin-top: 40rpx;
|
||||
.btn{
|
||||
display: inline-block;
|
||||
padding: 10px 20px;
|
||||
background: #e2e2e2;
|
||||
color: #26758d;
|
||||
border-radius: 10px;
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
.userinfo-box{
|
||||
position: relative;
|
||||
image{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
background: white;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
color: white;
|
||||
background-color: #26758d;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 40rpx 20rpx;
|
||||
}
|
||||
.user-box{
|
||||
background: #f6f6f6;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user