You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

374 lines
10 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<script setup>
import { onLoad } from "@dcloudio/uni-app"
// import mySwiper from "@/components/mySwiper.vue"
import {ref,onMounted,nextTick,computed} from "vue"
import unCombox from '@/uni_modules/uni-combox/components/uni-combox/uni-combox.vue'
import {useStore} from '@/store/index.js'
const store = useStore()
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')
if(uni.getStorageSync('operation_info')) {
h_info.value = JSON.parse(uni.getStorageSync('operation_info'))
if(h_info.value) {
// console.log(h_info.value)
getHospital(h_info.value.hospitalId)
}
}
})
// 变量
const h_queryParams = ref({
page:1,
pageSize:1000,
key:''
})
const hospitals = ref(null)
const userinfo = ref({})
const avatar = ref(null)
const h_info = ref({})
const inputDialog = ref(null)
const input_title = ref(null)
const hValue = ref('') // 医院
const hValueId = ref('') // 医院id
// const form_data = ref({})
// const userForm = ref(null)
// 方法
async function getHospitalList() {
const res = await api.getHospitalList(h_queryParams.value)
if(res.code == 0) {
hospitals.value = res.data.list
}
}
function onInputH() {
console.log(hValue.value)
h_queryParams.value.key = hValue.value
getHospitalList()
}
async function getHospital(id) {
const res = await api.getHospitalInfo(id)
if(res.code === 0) {
h_info.value.name = res.data.name
}
else{
uni.showToast({
title:res.msg,
icon:"error",
duration:2000,
mask:true,
success() {}
})
}
}
const edit_type= ref(null)
function toDetail(type) {
edit_type.value = type
switch(type){
case 1: // 修改昵称
inputDialog.value.open()
input_title.value = '修改昵称'
break;
case 2: // 修改电话
inputDialog.value.open()
input_title.value = '修改电话'
break;
default:
break;
}
}
function finishFunc() {
inputDialog.value.close()
}
const startDate = computed(() => getDate('start'))
const endDate = computed(() => getDate('end'))
const choosed_h = ref(null)
const date = ref(null)
function getDate(type) {
const date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
if (type === 'start') {
year = year - 60;
} else if (type === 'end') {
year = year + 2;
}
month = month > 9 ? month : '0' + month;
day = day > 9 ? day : '0' + day;
return `${year}-${month}-${day}`;
}
function bindDateChange(e) {
console.log(e)
h_info.value.surgery_time = e.detail.value
}
function toChooseH(item) {
console.log(item)
choosed_h.value = item
hValue.value = item.name
// hospitals.value = null
}
async function sumbmitFunc() {
// console.log(choosed_h.value,h_info.value,userinfo.value)
let obj = {
id: userinfo.value.userId,
// isSurgery: 1, //是否已经手术 0为手术1已经手术
surgery_time: h_info.value?.surgery_time, //手术时间
nickname: userinfo.value.nickname,
// avatar: '',
phone: userinfo.value.phone,
hospitalId:choosed_h.value?.ID
}
const res = await api.userinfoUpdae(obj)
// console.log('res is ',res)
if(res.code === 0) {
uni.showToast({
title:res.msg,
icon:"success",
duration:2000,
async success() {
await wx_login(userinfo.value.userId)
uni.navigateBack()
}
})
}
else{
uni.showToast({
title:res.msg,
icon:"error",
duration:2000
})
}
}
async function wx_login(userId){
let res=await new Promise(resolve=>{
uni.login({
provider: 'weixin', //使用微信登录
success: function (loginRes) {
resolve(loginRes);
console.log(loginRes,'微信登录返回信息');
}
});
});
let res2=await api.wx_login({code:res.code},userId);
if(res2.code === 0) {
uni.setStorageSync('userInfo',JSON.stringify(userinfo.value))
// is_login.value = custom.checkLogin()
store.checkLogin()
}
else{
uni.clearStorage();
}
}
</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(2)">
<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(3)">
<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">
<!-- {{h_info?.surgery_time}} -->
<picker mode="date" :value="h_info?.surgery_time" :start="startDate" :end="endDate" @change="bindDateChange">
<view class="rbc-content-row rbc-content-right">
<view class="uni-input"> {{h_info?.surgery_time}}</view>
<uni-icons type="forward" color="gray" size="20"></uni-icons>
</view>
</picker>
</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="paperplane" color="gray" size="26"></uni-icons>
手术医院</view>
<view class="rbc-content-row rbc-content-right">
<!-- {{h_info?.name}} -->
<uni-combox :border="false" @input="onInputH" :candidates="hospitals" placeholder="请选择医院" @choosed="toChooseH" v-model="userinfo.HospitalId"></uni-combox>
<!-- <uni-icons type="forward" color="gray" size="20"></uni-icons> -->
</view>
</view>
</view>
</view>
<!--修改姓名/电话 弹窗 -->
<uni-popup ref="inputDialog" >
<view class="pop-box">
<view class="pb-title">{{input_title}}</view>
<view class="pb-content">
<view class="pb-item">
<!-- <view class="pb-item-left">事项说明</view> -->
<view class="pb-item-right">
<!-- <input v-if="edit_type == 1" class="uni-input" v-model="userinfo.nickname" focus placeholder="输入您的姓名" />
<input v-else class="uni-input" v-model="userinfo.phone" focus placeholder="输入您的电话" /> -->
<uni-easyinput :inputBorder="false" v-if="edit_type == 1" borderColor="#26758d" v-model="userinfo.nickname" focus placeholder="输入您的姓名"></uni-easyinput>
<uni-easyinput :inputBorder="false" v-else borderColor="#26758d" v-model="userinfo.phone" focus placeholder="输入您的电话"></uni-easyinput>
</view>
</view>
<view class="pb-item pb-item-btn" @tap="finishFunc">确定</view>
</view>
</view>
</uni-popup>
<view class="pb-item pb-item-btn" style="margin-top: 40rpx;" @tap="sumbmitFunc">确定</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;
}
.pb-item-btn{
padding: 20rpx 0;
text-align: center;
color: white;
background: #26758d;
justify-content: center;
width: 66%;
margin: 0 auto;
border-radius: 10rpx;
}
.pop-box{
.pb-title{
text-align: center;
margin-bottom: 40rpx;
padding-top: 20rpx;
font-size: 32rpx;
font-weight: 900;
}
background-color: white;
padding: 20rpx;
width: 80%;
margin: 0 auto;
border-radius: 20rpx;
}
.pb-item{
display: flex;
align-items: center;
margin-bottom: 40rpx;
// justify-content: space-between;
.pb-item-left{
width: 30%;
color: gray;
}
.pb-item-right{
position: relative;
// margin-left: 10rpx;
width:100%;
}
}
:deep(){
.uni-popup__wrapper{
width: 100%;
}
}
</style>