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.
143 lines
4.3 KiB
Vue
143 lines
4.3 KiB
Vue
6 months ago
|
<template>
|
||
|
|
<view class="p-person-account g_w_all g_bg_f_5 g_kuaishou">
|
||
|
|
<view class="panel">
|
||
|
|
<view class="tip">手机号</view>
|
||
|
|
<view class="box g_bg_f g_flex_row_between" hover-class="g_bg_e">
|
||
|
|
<view class="g_flex_1 g_flex_row_start">
|
||
|
|
<view class="g_flex_column_center">
|
||
|
|
<view class="t-icon t-icon-shoujihaobangding g_w_36 g_h_36" style="width: 36px;height: 36px;"></view>
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8">
|
||
|
|
<view class="g_fs_14 g_c_3">手机号</view>
|
||
|
|
<view class="g_fs_12 g_c_9">+86 134****8878</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="g_flex_none g_flex_row_end">
|
||
|
|
<view class="g_flex_column_center g_fs_14 g_c_9">
|
||
|
|
已绑定
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8 g_flex_column_center">
|
||
|
|
<i class="iconfont icon-gengduo11 g_c_c"></i>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="panel">
|
||
|
|
<view class="tip">邮箱</view>
|
||
|
|
<view class="box g_bg_f g_flex_row_between" hover-class="g_bg_e">
|
||
|
|
<view class="g_flex_1 g_flex_row_start">
|
||
|
|
<view class="g_flex_column_center">
|
||
|
|
<view class="t-icon t-icon-youxiangbangding g_w_36 g_h_36" style="width: 36px;height: 36px;"></view>
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8">
|
||
|
|
<view class="g_fs_14 g_c_3">邮箱账号</view>
|
||
|
|
<view class="g_fs_12 g_c_9">1479885527@qq.com</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="g_flex_none g_flex_row_end">
|
||
|
|
<view class="g_flex_column_center g_fs_14 g_c_9">
|
||
|
|
已绑定
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8 g_flex_column_center">
|
||
|
|
<i class="iconfont icon-gengduo11 g_c_c"></i>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="panel">
|
||
|
|
<view class="tip">第三方账号</view>
|
||
|
|
<view class="boc">
|
||
|
|
<view class="item g_flex_row_between g_pb_10 g_bg_f" hover-class="g_bg_e" style="border-bottom: 0.5px solid #eeeeee;">
|
||
|
|
<view class="g_flex_1 g_flex_row_start">
|
||
|
|
<view class="g_flex_column_center">
|
||
|
|
<view class="t-icon t-icon-weixinbangding g_w_36 g_h_36" style="width: 36px;height: 36px;"></view>
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8">
|
||
|
|
<view class="g_fs_14 g_c_3">微信</view>
|
||
|
|
<view class="g_fs_12 g_c_9">b****0025</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="g_flex_none g_flex_rowRight_columnCenter">
|
||
|
|
<g-button btnText='解绑' type='infro' size='mini' />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="item g_flex_row_between g_pb_10 g_pt_10 g_bg_f" hover-class="g_bg_e" style="border-bottom: 0.5px solid #eeeeee;">
|
||
|
|
<view class="g_flex_1 g_flex_row_start">
|
||
|
|
<view class="g_flex_column_center">
|
||
|
|
<view class="t-icon t-icon-douyinbangding g_w_36 g_h_36" style="width: 36px;height: 36px;"></view>
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8">
|
||
|
|
<view class="g_fs_14 g_c_3">抖音</view>
|
||
|
|
<view class="g_fs_12 g_c_9">b****0025</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="g_flex_none g_flex_rowRight_columnCenter">
|
||
|
|
<g-button btnText='解绑' type='infro' size='mini' />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="item g_flex_row_between g_pt_10 g_bg_f" hover-class="g_bg_e">
|
||
|
|
<view class="g_flex_1 g_flex_row_start">
|
||
|
|
<view class="g_flex_column_center">
|
||
|
|
<view class="t-icon t-icon-kuaishoubangding g_w_36 g_h_36" style="width: 36px;height: 36px;"></view>
|
||
|
|
</view>
|
||
|
|
<view class="g_ml_8">
|
||
|
|
<view class="g_fs_14 g_c_3">快手</view>
|
||
|
|
<view class="g_fs_12 g_c_9">b****0025</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="g_flex_none g_flex_rowRight_columnCenter">
|
||
|
|
<g-button btnText='去绑定' type='none' size='mini' />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="panel">
|
||
|
|
<view class="tip">绑定第三方账号同步账号数据</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default{
|
||
|
|
onReady() {
|
||
|
|
this.G.setNavStyle();
|
||
|
|
},
|
||
|
|
onShareAppMessage() {
|
||
|
|
return this.G.shareFun();
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.p-person-account{
|
||
|
|
min-height: 100%;
|
||
|
|
.panel{
|
||
|
|
.tip{
|
||
|
|
padding: 16px 20px 8px;
|
||
|
|
font-size: 12px;
|
||
|
|
color: #999;
|
||
|
|
}
|
||
|
|
.box{
|
||
|
|
width: calc(100% - 20px);
|
||
|
|
margin: 0 auto;
|
||
|
|
border-radius: 8px;
|
||
|
|
padding: 10px;
|
||
|
|
}
|
||
|
|
.boc{
|
||
|
|
width: calc(100% - 20px);
|
||
|
|
margin: 0 auto;
|
||
|
|
.item{
|
||
|
|
padding: 10px;
|
||
|
|
&:first-child{
|
||
|
|
border-top-left-radius: 8px;
|
||
|
|
border-top-right-radius: 8px;
|
||
|
|
}
|
||
|
|
&:last-child{
|
||
|
|
border-bottom-left-radius: 8px;
|
||
|
|
border-bottom-right-radius: 8px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|