XinLingKeJi/jdt-user
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(custom):
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Huakk
2024-05-20 18:18:16 +08:00
parent 1b1b724110
commit 94a4b5e1df
25 changed files with 330 additions and 345 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
src/pages/user/index.scss Normal file
View File

@@ -0,0 +1,141 @@
.appUser {
box-sizing: border-box;
background-color: #f8f8f8;
height: 100%;
background-image: url('http://p0.meituan.net/csc/f44bb11463e3c538c307d7ce4b303bec33520.png');
background-size: 100% 500px;
background-repeat: no-repeat;
position: relative;
padding-top: 180px;
color: var(--nut-grid-item-text-color, var(--nut-title-color2, #666666));
}
.user-center-card__header__avatar {
img {
border-radius: 50%;
}
}
.user-center-card__header__info__phone {
color: #737373;
font-size: 25px;
}
.user-center-card__header__transparent {
padding-left: 30px;
background-color: transparent;
display: flex;
align-items: center;
box-sizing: border-box;
text-align: left;
padding-right: 20px;
.user-center-card__header__info {
margin-left: 20px;
width: 400px;
color: #333;
font-weight: bolder;
}
}
.cell-card {
box-sizing: border-box;
background-color: #fff;
padding: 30px;
.center {
display: flex;
justify-content: space-between;
color: #666;
padding: 0 30px;
.center-t {
margin-top: 30px;
display: flex;
flex-direction: column;
align-items: center;
.center-text {
margin-top: 15px;
}
}
}
}
.user-center {
background-color: #fff;
margin: 20px 0px;
padding: 20px;
-nut-grid-item-text-color: #333;
.box {
margin-top: 30px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 20px 100px;
box-sizing: border-box;
line-height: 1.5;
.box-mini {
display: flex;
box-sizing: border-box;
flex-direction: column;
align-items: center;
.label {
font-size: 25px;
margin-top: 10px;
color: #333333;
}
image {
width: 80px;
height: 80px;
}
}
}
}
.mer-box {
background-color: #fff;
margin: 20px;
width: 100%;
}
.user-acc {
background-image: url('http://p0.meituan.net/csc/a74c44a7af541f01efbcc6fb023e6e09132712.png');
background-size: 100% 100%;
background-repeat: no-repeat;
width: 90%;
height: 150px;
padding: 0 100px;
margin: 50px auto 0 auto;
.line {
width: 1px;
height: 50px;
background-color: #ffc300;
margin: 0 100px;
}
}
.kf-btn {
padding: 0 !important;
margin: 0 !important;
background: transparent;
-webkit-tap-highlight-color: transparent;
overflow: hidden;
font-size: 25px;
color: #333333;
line-height: 1;
.IconFont {
margin-bottom: 13px;
}
&::after {
border: none;
background: transparent;
line-height: 1;
}
}

363
src/pages/user/index.vue
View File

@@ -43,7 +43,7 @@
</view>
</view>
</view>
<view class="user-acc flex items-center text-center justify-evenly px-10">
<view class="user-acc flex items-center text-center justify-between">
<view>
<view class="text-[#ffc300] text-[40px] font-bold">{{
userInfo.data?.pulse || 0
@@ -58,124 +58,120 @@
<view class="text-[#CFAA32] text-[28px]">积分</view>
</view>
</view>
<view class="container">
<!--我的订单-->
<view class="border-box bg-[#fff] p-[20px]">
<view class="flex justify-between items-center">
<view class="text-[#333333]">我的订单</view>
<view
class="flex text-[#c9c9c9] items-center"
@click="toOrderList(0)">
<view class="text-[25px]">查看全部</view>
<ArrowRight size="10" />
</view>
</view>
<view class="flex justify-between text-[#666] px-[20px]">
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(1)">
<IconFont
name="http://p0.meituan.net/csc/9943f6c938fc0e310141a2b99d5bde6617483.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">待付款</view>
</view>
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(2)">
<IconFont
name="http://p0.meituan.net/csc/5306d094d7b4b61848dd21c86b693a9515523.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">待使用</view>
</view>
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(3)">
<IconFont
name="http://p0.meituan.net/csc/32ea9bbf51e3bbb0cbd75bc0fea97ca815779.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">已使用</view>
</view>
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(4)">
<IconFont
name="http://p0.meituan.net/csc/2e0dee89e9a3e3f2e7bf65db355fa11c11630.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">已失效</view>
</view>
<!--我的订单-->
<view class="border-box bg-[#fff] p-[20px]">
<view class="flex justify-between items-center mt-2">
<view class="text-[#333333] text-[32px]">我的订单</view>
<view class="flex text-[#c9c9c9] items-center" @click="toOrderList(0)">
<view class="text-[26px]">查看全部</view>
<ArrowRight size="12" />
</view>
</view>
<view class="flex justify-between text-[#666] px-[20px]">
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(1)">
<IconFont
name="http://p0.meituan.net/csc/9943f6c938fc0e310141a2b99d5bde6617483.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">待付款</view>
</view>
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(2)">
<IconFont
name="http://p0.meituan.net/csc/5306d094d7b4b61848dd21c86b693a9515523.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">待使用</view>
</view>
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(3)">
<IconFont
name="http://p0.meituan.net/csc/32ea9bbf51e3bbb0cbd75bc0fea97ca815779.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">已使用</view>
</view>
<view
class="mt-[30px] flex flex-col items-center"
@click="toOrderList(4)">
<IconFont
name="http://p0.meituan.net/csc/2e0dee89e9a3e3f2e7bf65db355fa11c11630.png"
size="42" />
<view class="mt-[15px] text-[25px] text-[#333333]">已失效</view>
</view>
</view>
</view>
<!-- 我的服务 -->
<view class="user-center" v-if="isLogin">
<view class="text-[#333333]">我的服务</view>
<view class="box">
<view v-for="(item, idx) in userMenuList" :key="idx">
<view
v-if="item.type !== 333"
class="box-mini"
@click="toPage(item.url)">
<IconFont size="42" :name="item.icon"></IconFont>
<view class="label">{{ item.label }}</view>
</view>
<button v-else class="kf-btn" open-type="contact">
<IconFont class="IconFont" size="42" :name="item.icon"></IconFont>
<view class="label">{{ item.label }}</view>
</button>
<!-- 我的服务 -->
<view class="user-center" v-if="isLogin">
<view class="text-[#333333] text-[32px] mt-2">我的服务</view>
<view class="box">
<view v-for="(item, idx) in userMenuList" :key="idx">
<view
v-if="item.type !== 333"
class="box-mini"
@click="toPage(item.url)">
<IconFont size="42" :name="item.icon"></IconFont>
<view class="label">{{ item.label }}</view>
</view>
<button v-else class="kf-btn" open-type="contact">
<IconFont class="IconFont" size="42" :name="item.icon"></IconFont>
<view class="label">{{ item.label }}</view>
</button>
</view>
</view>
</view>
<!-- 商家管理 -->
<view
class="user-center"
v-if="userInfo.data?.bid && userInfo.store_status === 1">
<view class="text-[#333333]">商家服务</view>
<view class="box">
<view
v-if="userInfo.data.permission.dd"
class="box-mini"
@click="toPage('/pages/admin/add_order/index')">
<IconFont
size="42"
name="http://p0.meituan.net/csc/72a389ac6a441061fd534b96644c431b7839.png"></IconFont>
<view class="label">后结点单</view>
</view>
<view
v-if="userInfo.data.permission.hx"
class="box-mini"
@click="toPage('/pages/admin/verify/index')">
<IconFont
size="42"
name="http://p1.meituan.net/csc/c236a8b7a73178da25218e1fb59a96f06610.png"></IconFont>
<view class="label">订单核销</view>
</view>
<view
v-if="userInfo.data.permission.tj"
class="box-mini"
@click="toPage('/pages/admin/order_manage/index')">
<IconFont
size="42"
name="http://p0.meituan.net/csc/bd9aca457a109b4d69a692a9109a73ed9045.png"></IconFont>
<view class="label">订单统计</view>
</view>
<view
v-if="userInfo.data.permission.tx"
class="box-mini"
@click="toPage('/pages/admin/withdrawal/index')">
<IconFont
size="42"
name="http://p0.meituan.net/csc/f85d7dc1bf9eda8977e9089b260a586b7440.png"></IconFont>
<view class="label">收益提现</view>
</view>
<!-- 商家管理 -->
<view
class="user-center"
v-if="userInfo.data?.bid && userInfo.store_status === 1">
<view class="text-[#333333] text-[32px] mt-2">商家服务</view>
<view class="box">
<view
v-if="userInfo.data.permission.dd"
class="box-mini"
@click="toPage('/pages/admin/add_order/index')">
<IconFont
size="42"
name="http://p0.meituan.net/csc/72a389ac6a441061fd534b96644c431b7839.png"></IconFont>
<view class="label">后结点单</view>
</view>
<view
v-if="userInfo.data.permission.hx"
class="box-mini"
@click="toPage('/pages/admin/verify/index')">
<IconFont
size="42"
name="http://p1.meituan.net/csc/c236a8b7a73178da25218e1fb59a96f06610.png"></IconFont>
<view class="label">订单核销</view>
</view>
<view
v-if="userInfo.data.permission.tj"
class="box-mini"
@click="toPage('/pages/admin/order_manage/index')">
<IconFont
size="42"
name="http://p0.meituan.net/csc/bd9aca457a109b4d69a692a9109a73ed9045.png"></IconFont>
<view class="label">订单统计</view>
</view>
<view
v-if="userInfo.data.permission.tx"
class="box-mini"
@click="toPage('/pages/admin/withdrawal/index')">
<IconFont
size="42"
name="http://p0.meituan.net/csc/f85d7dc1bf9eda8977e9089b260a586b7440.png"></IconFont>
<view class="label">收益提现</view>
</view>
</view>
</view>
<!-- 版权 -->
<view class="text-[#999999] mt-5 text-[20px] text-center">
<view>鑫瓴科技版权所有</view>
<view>v4.0.0</view>
</view>
<!-- 版权 -->
<view class="text-[#999999] mt-5 text-[20px] text-center">
<view>鑫瓴科技版权所有</view>
<view>v4.0.0</view>
</view>
<!-- 登录 -->
<Auth
@@ -309,7 +305,7 @@ const userMenuList = ref([
{
label: '设置',
url: '/pages/users/setting/index',
icon: 'http://p0.meituan.net/csc/333f2ec6a76c1fb2e442d277f8b99d5e2853.png',
icon: 'http://p0.meituan.net/csc/1d8e6b328d384ff042c282976b82feec6005.png',
},
]);
@@ -351,150 +347,5 @@ const scanCode = () => {
</script>
<style lang="scss">
.appUser {
box-sizing: border-box;
background-color: #f8f8f8;
height: 100%;
background-image: url('http://p0.meituan.net/csc/f44bb11463e3c538c307d7ce4b303bec33520.png');
background-size: 100% 500px;
background-repeat: no-repeat;
position: relative;
padding-top: 180px;
color: var(--nut-grid-item-text-color, var(--nut-title-color2, #666666));
}
.user-center-card__header__avatar {
img {
border-radius: 50%;
}
}
.user-center-card__header__info__phone {
color: #737373;
font-size: 25px;
}
.user-center-card__header__transparent {
padding-left: 30px;
background-color: transparent;
display: flex;
align-items: center;
box-sizing: border-box;
text-align: left;
padding-right: 20px;
.user-center-card__header__info {
margin-left: 20px;
width: 400px;
color: #333;
font-weight: bolder;
}
}
.container {
position: absolute;
top: 500px;
}
.cell-card {
box-sizing: border-box;
background-color: #fff;
padding: 30px;
.center {
display: flex;
justify-content: space-between;
color: #666;
padding: 0 30px;
.center-t {
margin-top: 30px;
display: flex;
flex-direction: column;
align-items: center;
.center-text {
margin-top: 15px;
}
}
}
}
.user-center {
background-color: #fff;
margin: 20px 0px;
padding: 20px;
-nut-grid-item-text-color: #333;
.box {
margin-top: 30px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 20px 100px;
box-sizing: border-box;
line-height: 1.5;
.box-mini {
display: flex;
box-sizing: border-box;
flex-direction: column;
align-items: center;
.label {
font-size: 25px;
margin-top: 10px;
color: #333333;
}
image {
width: 80px;
height: 80px;
}
}
}
}
.mer-box {
background-color: #fff;
margin: 20px;
width: 100%;
}
.user-acc {
background-image: url('http://p0.meituan.net/csc/a74c44a7af541f01efbcc6fb023e6e09132712.png');
background-size: 100% 100%;
background-repeat: no-repeat;
width: 95%;
height: 150px;
margin: 60px auto;
.line {
width: 1px;
height: 50px;
background-color: #ffc300;
margin: 0 100px;
}
}
.kf-btn {
padding: 0 !important;
margin: 0 !important;
background: transparent;
-webkit-tap-highlight-color: transparent;
overflow: hidden;
font-size: 25px;
color: #333333;
line-height: 1;
.IconFont {
margin-bottom: 13px;
}
&::after {
border: none;
background: transparent;
line-height: 1;
}
}
@import './index.scss';
</style>