测试登出

chenyc

2025-08-26 6bc0135358c021bc6d4d67e2b0a99a655e184552

 src/views/myMine/index.vue

@@ -1,40 +1,45 @@
<template>
    <div class="page">
        <div class="hader">
            <van-row>
                <van-col span="12">
            <div class="listrow">
                <div class="rowioc">
                    <van-image
                        round
                        width="50px"
                        height="50px"
                        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
                        :src="patientInfo.patientInfo.patientAvatarIcon"
                    />
                </van-col>
                <van-col span="12" class="hader-regth">
                    账号管理员
                    <van-icon name="arrow" />
                </van-col>
            </van-row>
                </div>
                <div class="rowtext">
                    手机号：{{patientInfo.patientInfo.patientTelNo}}
                </div>
            </div>
        </div>
        <div class="userInfo">
        <div class="userinfo">
            <div style="padding-left: 20px; padding-top: 12px; padding-right: 20px;">
                <van-row style="border-bottom: 1px solid #f1f1f2;margin-top: 12px;">
                    <van-col span="12" style="margin-bottom: 12px;">患者卡片</van-col>
                    <van-col span="12" style="text-align: right;padding-right: 5px;"> <van-icon name="arrow" /></van-col>
                </van-row>
            </div>

            <van-row style="padding-left: 20px;">
                <van-col span="16" class="info16">
                    <div class="div1">张三丰
                    <div class="div1">{{patientInfo.patientInfo.patientName}}
                        <span class="but">排班提醒</span>
                    </div>
                    <div class="div2">患者卡号</div>
                    <div class="div3">000000001</div>
                    <div class="div2">卡号:{{patientInfo.patientInfo.patientCardNo}}</div>
                    <div class="div3" style="color: #409eff; font-family: cursive; font-size: 16px;">我的积分:{{patientInfo.patientInfo.patientCreditValue}} </div>
                </van-col>
                <van-col span="8" class="info8">
                    <div class="img">
                    <div class="img" @click="imgShow">
                        <img
                            style=" width: 50px;height: 50px;margin-left: 8%; margin-top: 22px;"
                            preview="1"
                            style=" width: 55px;height: 55px;margin-left: 8%; margin-top: 15px;"
                            referrerpolicy="no-referrer"
                            src="@/views/home/assets/img/SketchPng011ef35b32ef075413b756766208370cde43357dffc3333d2acf29b70793c15d.png"
                            :src="erweima"
                        />
                    </div>
                    <div class="text" style="font-size: 10px;font-weight: 400;color: #777777;">
                        出示称重码
                        <div class="devcc">出示患者码</div>
                    </div>
                </van-col>
            </van-row>
@@ -43,7 +48,17 @@
            <div style="padding-left: 20px;">
                <div class="title">其他服务</div>
                <van-row>
                    <van-col span="6" class="serveItem">
                    <van-col span="6" class="serveitem">
                        <div @click="openOrder">
                            <van-image
                                :src="serve2"
                            />
                        </div>
                        <div @click="openOrder">
                            我的订单
                        </div>
                    </van-col>
                    <van-col span="6" class="serveitem">
                        <div>
                            <van-image
                                :src="serve1"
@@ -53,114 +68,279 @@
                            我的用药
                        </div>
                    </van-col>
                    <van-col span="6" class="serveItem">
                    <van-col span="6" class="serveitem">
                        <div>
                            <van-image
                                :src="serve1"
                                :src="serve2"
                            />
                        </div>
                        <div>
                            检验指标
                        </div>
                    </van-col>
                    <van-col span="6" class="serveItem">
                    <van-col span="6" class="serveitem">
                        <div>
                            <van-image
                                :src="serve1"
                                :src="serve3"
                            />
                        </div>
                        <div>
                            科室公告
                        </div>
                    </van-col>
                    <van-col span="6" class="serveItem">
                    <van-col span="6" class="serveitem">
                        <div>
                            <van-image
                                :src="serve1"
                                :src="serve4"
                            />
                        </div>
                        <div>
                            科室介绍
                        </div>
                    </van-col>
                    <van-col span="6" class="serveItem">
                    <van-col span="6" class="serveitem">
                        <div>
                            <van-image
                                :src="serve1"
                                :src="serve5"
                            />
                        </div>
                        <div>
                            智慧云客服
                        </div>
                    </van-col>
                    <van-col span="6" @click="show2 = true" class="serveitem">
                        <div>
                            <van-image
                                :src="serve6"
                            />
                        </div>
                        <div>
                            更改密码
                        </div>
                    </van-col>
                </van-row>
            </div>
        </div>
        <div class="buttonbody">
            <van-button type="primary" @click="logOUT" round block>退出登录</van-button>
        </div>
        <van-popup v-model:show="show">
            <div class="imgcla">
                <img
                    preview="1"
                    style=" width: 350px;height: 350px;"
                    referrerpolicy="no-referrer"
                    :src="erweiImg"
                />
            </div>
        </van-popup>
        <van-popup v-model:show="show2" :style="{ height: '30%' }">
            <div class="formbiaodan">
                <van-form @submit="onSubmitUpPssword" label-width="80px">
                    <van-cell-group inset>
                        <van-field
                            v-model="ruleForm.pass"
                            type="password"
                            label="密&nbsp&nbsp码"
                            placeholder="6-16位数字或者字母组合"
                            :rules="[{ required: true, message: '请填写密码' }]"
                        />
                        <van-field
                            v-model="ruleForm.newPassword"
                            type="password"
                            label="确认密码"
                            placeholder="6-16位数字或者字母组合"
                            :rules="[{ validator: asyncValidator, message: '密码输入不一致' }]"
                        />
                    </van-cell-group>
                    <div style="margin: 16px;">
                        <van-button :loading="loadingBUt" round block type="primary" native-type="submit">
                            提交
                        </van-button>
                    </div>
                    <div style="text-align: right; padding-right: 20px;">
                        <span type="primary" @click="show2 = false" native-type="submit">
                            取消
                        </span>
                    </div>
                </van-form>
            </div>
        </van-popup>
        <myOrder ref="myOrderRef"></myOrder>
        <van-tabbar v-model="active" @change="tabChang">
            <van-tabbar-item name="home" @click="active = 'home'" icon="home-o">首页</van-tabbar-item>
            <van-tabbar-item name="my" @click="active = 'my'" icon="manager">我的</van-tabbar-item>
            <van-tabbar-item name="home" icon="like">首页</van-tabbar-item>
            <van-tabbar-item name="jifen" icon="cart-circle-o">积分商城</van-tabbar-item>
            <van-tabbar-item name="my" icon="manager">我的</van-tabbar-item>
        </van-tabbar>
    </div>
</template>
<script lang="ts" setup>
    import { ref } from 'vue'
    import { ref,computed } from 'vue'
    import {ajaxPost} from '@/utils/axios'
    import { Session } from '@/utils/storage'
    import { userInfoStore } from '@/stores/userInfo'
    import myOrder from '../jifenShangCheng/components/myOrder.vue'
    import serve1 from './imgs/serve1.png'
    import { Image as VanImage,Tabbar as VanTabbar , TabbarItem as VanTabbarItem} from 'vant'
    import serve2 from './imgs/serve2.png'
    import serve3 from './imgs/serve3.png'
    import serve4 from './imgs/serve4.png'
    import serve5 from './imgs/serve5.png'
    import serve6 from './imgs/serve6.png'
    import erweima from './imgs/erwm.png'
    import {useRouter} from 'vue-router'
    import { Dialog } from 'vant'
    const router=useRouter()
    const userInfo = userInfoStore()
    const myOrderRef=ref()
    const active=ref('my')
    const ruleForm=ref({
        newPassword:'',
        pass:'',
    })
    const loadingBUt= ref(false)
    const show=ref(false)
    const show2=ref(false)
    const erweiImg=ref('')
    const asyncValidator = (val:any) =>{
        return val===ruleForm.value.pass
    }
    const openOrder=()=>{
        myOrderRef.value.openShow()
    }
    const tabChang=(index:any)=>{
        if (index==='home'){
            router.push('/')
        } else {
        } else if (index==='jifen') {
            router.push('jifenShangCheng')
        } else if (index==='my') {
            router.push('my')
        }
    }
    const imgShow=()=>{
        show.value=true
        ajaxPost('/patient/info/showQRCode',`patientCode=${patientInfo.value.patientInfo.code}&isForceLoad=1`).then((res:any)=>{
            show.value=true
            erweiImg.value=res
        })
    }
    const patientInfo=computed(()=>{
        return userInfo.patient
    })
    const onSubmitUpPssword=(values:any)=>{
        console.log('提交表单',ruleForm.value)
        console.log(values)
        const pams={
            patientCode:patientInfo.value.patientInfo.code,
            password:ruleForm.value.pass
        }
        loadingBUt.value=true
        ajaxPost('/patient/info/resetPassword',pams).then((re:any)=>{
            console.log(re)
            loadingBUt.value=false
            if (re==='OK'){
                show2.value=false
                Dialog.alert({
                    title: '提示',
                    message: '密码重置成功',
                }).then(() => {
                    // on close
                })
            }

        }).catch(err=>{
            loadingBUt.value=false
            console.log(err)
        })

    }
    const logOUT=()=>{
        ajaxPost('/patient/info/logout','').then((re:any)=>{
            console.log(re)
            Session.remove('token')
            Session.clear() // 清除缓存/token等
            alert('退出登录成功',Session.get('token'))
            router.push('login')
        })
    }
</script>
<style lang="scss" scoped>
.page{
    background-color: #F6FAFF;
    position:relative;
body {
    background-color: #166bd3;
}

.page {
    .imgcla {
        width: 350px;
        min-height: 350px;
        border: #777 1px solid;
    }

    .formbiaodan {
        padding-top: 30px;
        width: 350px;
    }
    background-color: #f6faff;
    position: relative;
    min-width: 375px;
    min-height: 800px;
    text-align: center;
    .hader{

    .hader {
        margin-top: 20px;
        margin-bottom: 20px;
        height: 50px;
        width: 92%;
        margin-left: 4%;
        text-align:left;
        .hader-regth{
        text-align: left;

        .listrow {
            grid-template-columns: minmax(50px, 20%) 1fr;
            display: grid;

            .rowtext {
                margin-top: 15px;
                font-size: 13px;

                // font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #777;
            }
        }

        .hader-regth {
            height: 50px;
            text-align:right;
            text-align: right;
            line-height: 50px;
        }
    }
    .userInfo{

    .userinfo {
        width: 92%;
        margin-left: 4%;
        height: 100px;
        background: #FFFFFF;
        box-shadow: 0px 2px 4px 0px rgba(70,150,249,0.1);
        height: 160px;
        background: #fff;
        box-shadow: 0 2px 4px 0 rgba(70, 150, 249, 0.1);
        border-radius: 5px;
        .info16{

        .info16 {
            text-align: left;

            // background:red;
            .div1{
            .div1 {
                margin-top: 20px;
                margin-bottom: 6px;
                height: 21px;
                font-size: 15px;
                font-family: PingFangSC-Medium, PingFang SC;

                // font-family: PingFangSC-Medium, PingFang SC;
                font-weight: 500;
                color: #333333;
                color: #333;
                line-height: 21px;
                .but{
                    font-family: PingFangSC-Regular, PingFang SC;

                .but {
                    // font-family: PingFangSC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #FDFDFD;
                    background:rgb(77, 124, 212);
                    color: #fdfdfd;
                    background: rgb(77, 124, 212);
                    border-radius: 8px;
                    height: 20px;
                    line-height: 20px;
@@ -168,55 +348,89 @@
                    padding: 2px 8px;
                }
            }
            .div2{

            .div2 {
                height: 17px;
                font-size: 12px;
                font-family: PingFangSC-Regular, PingFang SC;

                // font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #777777;
                color: #777;
                line-height: 17px;
            }
            .div3{

            .div3 {
                margin-top: 6px;
                height: 20px;
                font-size: 14px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
                font-weight: 400;
                color: #777777;
                color: #777;
                line-height: 20px;
            }

        }
    }
    .serves{
        background: #FFFFFF;

    .serves {
        background: #fff;
        border-radius: 8px;
        align-self: center;
        margin-top: 20px;
        width: 92%;
        margin-left: 4%;
        padding-top: 12px;

        // padding-left: 20px;
        padding-bottom: 20px;
        .title{

        .title {
            margin-top: 12px;
            overflow-wrap: break-word;
            color: rgba(51, 51, 51, 1);
            font-size: 14px;
            font-family: PingFangSC-Medium;
            font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
            text-align: left;
            white-space: nowrap;
            line-height: 20px;

            // margin-bottom: 20px;
        }
        .serveItem{

        .serveitem {
            text-align: center;
            margin-top: 20px;
            font-size: 13px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
            font-weight: 400;
            color: #333333;
            color: #333;
            line-height: 20px;
        }
    }
}

.info8 {
    text-align: right;
    padding-right: 40px;
    border-left: #f1f1f2  solid 1px;

    // background: #166bd3;
    .devcc {
        height: 14px;
        font-size: 10px;
        font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
        font-weight: 400;
        color: #777;
        line-height: 14px;
    }
}

.text {
    background: #166bd3;
}

.buttonbody {
    margin-top: 40px;
    width: 92%;
    margin-left: 4%;
}
</style>