93 lines
2.0 KiB
Vue
93 lines
2.0 KiB
Vue
|
<template>
|
||
|
|
<div class="bindPage_page">
|
||
|
|
<div class="bindPage_page_body">
|
||
|
|
<div class="bind_item">
|
||
|
|
<div class="title">Bind Wechat</div>
|
||
|
|
<div class="box">
|
||
|
|
<div class="type">
|
||
|
|
<img src="@/assets/images/loginPage/weiXinIcon.svg" alt="">
|
||
|
|
<div class="text">Unbound</div>
|
||
|
|
</div>
|
||
|
|
<div class="gallery_btn">Bind Now</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts">
|
||
|
|
import { defineComponent,computed,ref,reactive,nextTick,toRefs,createVNode, onMounted} from 'vue'
|
||
|
|
import { Https } from "@/tool/https";
|
||
|
|
import { Modal,message } from 'ant-design-vue';
|
||
|
|
import { useStore } from "vuex";
|
||
|
|
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
|
||
|
|
import { useI18n } from 'vue-i18n'
|
||
|
|
export default defineComponent({
|
||
|
|
components:{
|
||
|
|
},
|
||
|
|
setup() {
|
||
|
|
const store = useStore();
|
||
|
|
let userInfo:any= computed(()=>{
|
||
|
|
return store.state.UserHabit.userInfo
|
||
|
|
})
|
||
|
|
let cookieUserInfo = JSON.parse(getCookie('userInfo') as any)
|
||
|
|
let accountHomeData:any = reactive({
|
||
|
|
cropperFileData:{name:'',uid:''}, //裁剪的原始文件数据
|
||
|
|
uploadUrl:userInfo.value?.avatar,
|
||
|
|
uploadFile:undefined,
|
||
|
|
token:'',
|
||
|
|
fileList:[]
|
||
|
|
})
|
||
|
|
return{
|
||
|
|
...toRefs(accountHomeData),
|
||
|
|
userInfo,
|
||
|
|
cookieUserInfo,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data(){
|
||
|
|
return{
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<style lang="less" scoped>
|
||
|
|
.bindPage_page{
|
||
|
|
.bindPage_page_body{
|
||
|
|
.bind_item{
|
||
|
|
margin-bottom: 4rem;
|
||
|
|
>.title{
|
||
|
|
font-size: 2rem;
|
||
|
|
margin-bottom: 2rem;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
>.box{
|
||
|
|
width: 100%;
|
||
|
|
border: 2px solid #000;
|
||
|
|
border-radius: 2rem;
|
||
|
|
padding: 3rem;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
>.type{
|
||
|
|
display: flex;
|
||
|
|
>img{
|
||
|
|
margin-right: 3rem;
|
||
|
|
width: 5rem;
|
||
|
|
height: 5rem;
|
||
|
|
}
|
||
|
|
>.text{
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.bind_item:last-child{
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|