434 lines
20 KiB
HTML
434 lines
20 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>个人中心</title>
|
||
<link rel="stylesheet" href="../../css/grzx/grzx.css">
|
||
<link rel="stylesheet" type="text/css" href="../../css/layui.css" />
|
||
</head>
|
||
|
||
<body>
|
||
<header class="ty_herader">
|
||
<img src="../../img/grzx/topimg.jpg" title="图1" alt="图片已缺失">
|
||
|
||
<nav class="ty_w ty_ds">
|
||
<img src="../../img/logo.png" title="图2" alt="图片已缺失">
|
||
<ul class="ty_listnav">
|
||
<li> 123</li>
|
||
<li><span class="ty_di"></span><a href="">网站首页</a></li>
|
||
<li><span class="ty_di"></span><a href="">关于我们</a></li>
|
||
<li><span class="ty_di"></span><a href=""><img class="ty_topicon" title="图3" src="../../img/sy-scart.png" alt="图片已缺失">我的购物车</a></li>
|
||
<li><span class="ty_di"></span><a href="">积分商城</a></li>
|
||
<li><span class="ty_di"></span><a href="">联系我们</a></li>
|
||
<li><span class="ty_di"></span><a href="" class="ty_gr">个人中心</a></li>
|
||
<li><a href="">【退出】</a></li>
|
||
</ul>
|
||
</nav>
|
||
</header>
|
||
<div class="mian ty_co">
|
||
<div class="ty_w ty_ds">
|
||
<ul class="ty_left">
|
||
<li class="ty_lefttx"><img src="../../img/grzx/tx_04.jpg" title="图4" alt="图片已缺失"><span>243</span></li>
|
||
<li data-in="1" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_1.jpg" title="图5" alt="图片已缺失"> <img src="../../img/grzx/iocn (1).jpg" title="图5" alt="图片已缺失"> <span>个人资料</span></li>
|
||
<li data-in="2" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_2.jpg" title="图6" alt="图片已缺失"> <img src="../../img/grzx/iocn (2).jpg" title="图6" alt="图片已缺失"> <span>密码修改</span></li>
|
||
<li data-in="3" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_3.jpg" title="图7" alt="图片已缺失"> <img src="../../img/grzx/iocn (3).jpg" title="图7" alt="图片已缺失"> <span>我的订单</span></li>
|
||
<li data-in="4" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_4.jpg" title="图8" alt="图片已缺失"> <img src="../../img/grzx/iocn (4).jpg" title="图8" alt="图片已缺失"> <span>我的关注</span></li>
|
||
<li data-in="5" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_5.jpg" title="图9" alt="图片已缺失"> <img src="../../img/grzx/iocn (5).jpg" title="图9" alt="图片已缺失"> <span>我的收藏</span></li>
|
||
<li data-in="6" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_6.jpg" title="图10" alt="图片已缺失"> <img src="../../img/grzx/iocn (6).jpg" title="图10" alt="图片已缺失"> <span>我的积分</span></li>
|
||
<li data-in="7" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_7.jpg" title="图11" alt="图片已缺失"> <img src="../../img/grzx/iocn (7).jpg" title="图11" alt="图片已缺失"> <span>我的优惠券</span></li>
|
||
<li data-in="8" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_8.jpg" title="图12" alt="图片已缺失"> <img src="../../img/grzx/iocn (8).jpg" title="图12" alt="图片已缺失"> <span>征稿作品管理</span></li>
|
||
<li data-in="9" class="ty_leftcon"> <img class="ty_listimg" src="../../img/grzx/iocn_9.jpg" title="图12" alt="图片已缺失"> <img src="../../img/grzx/iocn (9).jpg" title="图12" alt="图片已缺失"> <span>收货地址</span></li>
|
||
</ul>
|
||
|
||
<!-- <div class="ty_ris ">
|
||
<p class="ty_tit">个人资料</p>
|
||
|
||
<div class="ty_riscon">
|
||
<div class="ty_tupian">
|
||
<div class="ty_scimg">
|
||
<img src="" alt="图片已缺失">
|
||
</div>
|
||
|
||
<div>
|
||
<button class="ty_tubtn"><img src="../../img/grzx/tusc.jpg" title="图14" alt="图片已缺失">请选择您要上传的头像</button>
|
||
<p class="ty_col">仅支持JPG,GIF,PNG,JPEG,BMP格式</p>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div>
|
||
|
||
<div class="ty_name">
|
||
<p>用户名：</p>
|
||
<p>asdgf</p>
|
||
</div>
|
||
<div class="ty_int">
|
||
<p>姓名：</p>
|
||
<input type="text">
|
||
</div>
|
||
<div class="ty_int">
|
||
<p>电话：</p>
|
||
<input type="text">
|
||
</div>
|
||
<div class="ty_setle">
|
||
<p>电话：</p>
|
||
<select name="" id="">
|
||
<option value="">四川省</option>
|
||
</select>
|
||
<select name="" id="">
|
||
<option value="">成都市</option>
|
||
</select>
|
||
<select name="" id="">
|
||
<option value="">锦江区</option>
|
||
</select>
|
||
</div>
|
||
<div class="ty_int">
|
||
<p></p>
|
||
<input class="tyint_pal" placeholder="请输入详情地址" type="text">
|
||
</div>
|
||
|
||
<div class="ty_btn">
|
||
<button>提交</button>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div> -->
|
||
<!-- <div class="ty_ris ">
|
||
<p class="ty_tit">个人资料</p>
|
||
|
||
<div class="ty_riscon ty_riscon1">
|
||
|
||
|
||
|
||
<div>
|
||
|
||
<div class="ty_int ty_wic">
|
||
<p>原密码：</p>
|
||
<input type="text">
|
||
</div>
|
||
<div class="ty_int ty_wic">
|
||
<p>新密码：</p>
|
||
<input type="text">
|
||
</div>
|
||
<div class="ty_int ty_wic">
|
||
<p>确认新密码:</p>
|
||
<input type="text">
|
||
</div>
|
||
|
||
|
||
|
||
<div class="ty_btn ty_btn1">
|
||
<button>提交</button>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div> -->
|
||
|
||
<!-- <div class="ty_ris">
|
||
<div class="ty_shtit">
|
||
<div>
|
||
<p>收货地址</p>
|
||
<p>您以创建2个收货地址，最多可创建25个</p>
|
||
</div>
|
||
<p class="ty_cz">新增收货地址</p>
|
||
</div>
|
||
|
||
<div class="ty_con">
|
||
|
||
<div class="ty_dizcon">
|
||
<div class="ty_dzxx">
|
||
<div>
|
||
<p>张珊珊</p>
|
||
<p>默认地址</p>
|
||
</div>
|
||
<p><img src="../../img/grzx/sh1.jpg" alt=""></p>
|
||
</div>
|
||
<p class="ty_dztext">收货人：<span>张珊珊</span> </p>
|
||
<p class="ty_dztext">所在地区：<span>四川成都市温江区</span> </p>
|
||
<p class="ty_dztext">地址：<span>光华大道1568号</span> </p>
|
||
|
||
<div class="ty_mr">
|
||
<p class="ty_dztext">手机号：<span>136****4451</span></p>
|
||
<div>
|
||
|
||
<p>编辑</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="ty_dizcon">
|
||
<div class="ty_dzxx">
|
||
<div>
|
||
<p>张珊珊</p>
|
||
|
||
</div>
|
||
<p><img src="../../img/grzx/sh1.jpg" alt=""></p>
|
||
</div>
|
||
<p class="ty_dztext">收货人：<span>张珊珊</span> </p>
|
||
<p class="ty_dztext">所在地区：<span>四川成都市温江区</span> </p>
|
||
<p class="ty_dztext">地址：<span>光华大道1568号</span> </p>
|
||
|
||
<div class="ty_mr">
|
||
<p class="ty_dztext">手机号：<span>136****4451</span></p>
|
||
<div>
|
||
<p>设为默认地址</p>
|
||
<p>编辑</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div> -->
|
||
|
||
<!-- <div class="ty_ris">
|
||
<div class="ty_yhtit">
|
||
<p data-in="1" class="ty_yhd yhdj">可用优惠卷</p>
|
||
<p data-in="2" class="yhdj">已过期优惠卷</p>
|
||
</div>
|
||
<div class="ty_con ty_tp" style="padding: 32px 26px 0;display: flex; justify-content: space-between;">
|
||
|
||
|
||
|
||
<div class="ty_yhuij">
|
||
<div>
|
||
<div class="ty_gb">
|
||
<img src="../../img/grzx//yhgb.png" alt="">
|
||
</div>
|
||
|
||
<p class="ty_yhmn"><span>￥</span>50</p>
|
||
<p class="ty_textyh">满500可用</p>
|
||
<p style="color: rgb(42,140, 142);">2021.07.15-2021.07.15</p>
|
||
<img style="margin-bottom: -8px;" src="../../img/grzx/bjyh.png" alt="">
|
||
</div>
|
||
<div>
|
||
<button class="ty_yhbtn">立即使用</button>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="ty_yhuij">
|
||
<div>
|
||
|
||
|
||
<p class="ty_yhmn"><span>￥</span>100</p>
|
||
<p class="ty_textyh">满500可用</p>
|
||
<p style="color: rgb(42,140, 142);">2021.07.15-2021.07.15</p>
|
||
<img style="margin-bottom: -8px;" src="../../img/grzx/bjyh.png" alt="">
|
||
</div>
|
||
<div>
|
||
<button class="ty_yhbtn">立即使用</button>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="ty_yhuij">
|
||
<div>
|
||
|
||
|
||
<p class="ty_yhmn"><span>￥</span>50</p>
|
||
<p class="ty_textyh">满500可用</p>
|
||
<p style="color: rgb(42,140, 142);">2021.07.15-2021.07.15</p>
|
||
<img style="margin-bottom: -8px;" src="../../img/grzx/bjyh.png" alt="">
|
||
</div>
|
||
<div>
|
||
<button class="ty_yhbtn">立即使用</button>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="ty_yhuij">
|
||
<div>
|
||
|
||
<p class="ty_yhmn"><span>￥</span>50</p>
|
||
<p class="ty_textyh">满500可用</p>
|
||
<p style="color: rgb(42,140, 142);">2021.07.15-2021.07.15</p>
|
||
<img style="margin-bottom: -8px;" src="../../img/grzx/bjyh.png" alt="">
|
||
</div>
|
||
<div>
|
||
<button class="ty_yhbtn">立即使用</button>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="ty_con ty_tp" style="padding: 32px 26px 0;display: none; ">
|
||
<div class="ty_yhuij">
|
||
<div style="background-color: rgb(173,173,173);">
|
||
<p class="ty_yhmn"><span>￥</span>50</p>
|
||
<p class="ty_textyh">满500可用</p>
|
||
<p style="color: rgb(42,140, 142);">2021.07.15-2021.07.15</p>
|
||
<img style="margin-bottom: -8px;" src="../../img/grzx/bjyh.png" alt="">
|
||
</div>
|
||
<div class="gqtp">
|
||
<img src="../../img/grzx/gqtp.png" alt="">
|
||
</div>
|
||
|
||
</div>
|
||
<div class="ty_yhuij">
|
||
<div style="background-color: rgb(173,173,173);">
|
||
|
||
|
||
<p class="ty_yhmn"><span>￥</span>50</p>
|
||
<p class="ty_textyh">满500可用</p>
|
||
<p style="color: rgb(42,140, 142);">2021.07.15-2021.07.15</p>
|
||
<img style="margin-bottom: -8px;" src="../../img/grzx/bjyh.png" alt="">
|
||
</div>
|
||
<div class="gqtp">
|
||
<img src="../../img/grzx/gqtp.png" alt="">
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div> -->
|
||
|
||
|
||
|
||
<div class="ty_ris">
|
||
<p class="ty_tit">我的订单</p>
|
||
<div class="ty_con" style="height: auto; padding: 25px 24px 20px;">
|
||
<div class="ty_ddtit">
|
||
<div class="ty_ddnav">
|
||
<p class="ty_ddys">全部订单</p>
|
||
<p>待付款
|
||
</p>
|
||
<p>待发货</p>
|
||
<p>待收货</p>
|
||
</div>
|
||
|
||
<div class="ty_ddxq">
|
||
<p>订单详情</p>
|
||
|
||
<div>
|
||
<p>收货人</p>
|
||
<p>金额</p>
|
||
<div>全部状态<img src="../../img/grzx/qbdd.png" alt=""></div>
|
||
<p>操作</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="ty_ddcon">
|
||
<div class="ty_ddcontit">
|
||
<div style="display: flex;align-items: center;">
|
||
<p style="margin-right: 30px;"><span>2021-07-10</span><span>15:24:44</span></p>
|
||
<p><span>订单号：</span><span style="color: #000;">10954896547</span></p>
|
||
</div>
|
||
<div>
|
||
<p>删除</p>
|
||
<img src="../../img/grzx/ljt.png" alt="">
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="ty_ddxx">
|
||
<div>
|
||
<div>
|
||
<img src="../../img/grzx/yt.png" alt="">
|
||
<p></p>
|
||
<p></p>
|
||
<p></p>
|
||
</div>
|
||
<div>
|
||
<img src="../../img/grzx/yt1.png" alt="">
|
||
<p></p>
|
||
<p></p>
|
||
<p></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
</div>
|
||
|
||
|
||
</div>
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<div class="ty_xzsh">
|
||
<div class="ty_tcon">
|
||
<div class="ty_tctiti">
|
||
<p>新增收货地址</p>
|
||
<p class="ty_gbtc"><img src="../../img/grzx/sh.jpg" alt=""></p>
|
||
</div>
|
||
|
||
<div class="ty_tris">
|
||
|
||
<div class="ty_int ty_tcwi ">
|
||
<p>收货人：</p>
|
||
<input type="text">
|
||
</div>
|
||
|
||
<div class="ty_setle ty_tcwi">
|
||
<p>所在地址：</p>
|
||
<select name="" id="">
|
||
<option value="">四川省</option>
|
||
</select>
|
||
<select name="" id="">
|
||
<option value="">成都市</option>
|
||
</select>
|
||
<select name="" id="">
|
||
<option value="">锦江区</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="ty_int ty_tcwi">
|
||
<p></p>
|
||
<input class="tyint_pal" placeholder="请输入详情地址" type="text">
|
||
</div>
|
||
<div class="ty_int ty_tcwi">
|
||
<p>手机：</p>
|
||
<input type="text">
|
||
</div>
|
||
|
||
<div class="ty_btn">
|
||
<button style="width: 155px;height: 51px;margin-right: 3px;">保存收货地址</button>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="../../js/jquery-1.9.1.js"></script>
|
||
<script src="../../js/layui.js"></script>
|
||
<script>
|
||
$(".ty_cz").on("click", () => {
|
||
$(".ty_xzsh").css("display", "flex")
|
||
$("body").css("overflow", "hidden")
|
||
})
|
||
$(".ty_gbtc").on("click", () => {
|
||
$(".ty_xzsh").css("display", "none")
|
||
$("body").css("overflow", "auto")
|
||
})
|
||
$(".yhdj").on("click", () => {
|
||
if ($(event.target).attr("data-in") == 1) {
|
||
|
||
$($(".ty_tp")[1]).css("display", "none")
|
||
$($(".ty_tp")[0]).css("display", "flex")
|
||
$($(".yhdj")[0]).addClass("ty_yhd");
|
||
$($(".yhdj")[1]).removeClass("ty_yhd");
|
||
} else {
|
||
$($(".ty_tp")[0]).css("display", "none")
|
||
$($(".ty_tp")[1]).css("display", "flex")
|
||
$($(".yhdj")[1]).addClass("ty_yhd");
|
||
$($(".yhdj")[0]).removeClass("ty_yhd");
|
||
}
|
||
|
||
})
|
||
</script>
|
||
</body>
|
||
|
||
</html> |