mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2026-08-06 10:57:26 +08:00
fix: 增强错误处理与组件逻辑优化
- 在 App.vue 中添加 JSON 解析错误处理,确保站点信息获取的稳定性。 - 更新多个 API 请求,添加 loading 状态管理,提升用户体验。 - 在 Search.vue 中优化热词列表的解析逻辑,增强容错性。 - 改进购物车、地址管理等 API 请求参数,确保一致性与可用性。 - 新增用户中心布局组件,提升用户界面的一致性与可读性。
This commit is contained in:
@@ -1,45 +1,48 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="账户安全"/>
|
||||
<div class="safeList">
|
||||
<UserCenterLayout title="账户安全" :tabs="['账户安全']">
|
||||
<div class="safeList">
|
||||
<!-- 密码 -->
|
||||
<div class="safeItem">
|
||||
<div :span="2">
|
||||
<div class="safeItem-icon">
|
||||
<el-icon :size="40"><Key /></el-icon>
|
||||
</div>
|
||||
<div :span="16">
|
||||
<div class="safeItem-content">
|
||||
<div class="setDivItem">登录密码</div>
|
||||
<div class="setDivItem theme">互联网账号存在被盗风险,建议您定期更改密码以保护账户安全。</div>
|
||||
</div>
|
||||
<div :span="4">
|
||||
<div class="safeItem-action">
|
||||
<el-button @click="modifyPwd">修改密码</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="safeItem">
|
||||
<div :span="2">
|
||||
<el-icon :size="40"><Link /></el-icon>
|
||||
</div>
|
||||
<div :span="16">
|
||||
<div class="setDivItem">第三方账户绑定</div>
|
||||
<div class="setDivItem theme">绑定后可使用第三方账号快捷登录。</div>
|
||||
<div class="connectList">
|
||||
<div class="connectRow">
|
||||
<div class="connectRowLeft">
|
||||
<span class="connectName">{{ wechatConnect.label }}</span>
|
||||
<el-tag v-if="isBound(wechatConnect.type)" color="success">已绑定</el-tag>
|
||||
<el-tag v-else>未绑定</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<el-skeleton size="large" fix v-if="connectLoading"></el-skeleton>
|
||||
<div class="safeItem safeItem-connect">
|
||||
<div class="safeItem-main">
|
||||
<div class="safeItem-icon">
|
||||
<el-icon :size="40"><Link /></el-icon>
|
||||
</div>
|
||||
<div class="safeItem-content">
|
||||
<div class="setDivItem">第三方账户绑定</div>
|
||||
<div class="setDivItem theme">绑定后可使用第三方账号快捷登录。</div>
|
||||
</div>
|
||||
<div class="safeItem-action">
|
||||
<el-button v-if="!isBound(wechatConnect.type)" type="primary" @click="openBindModal(wechatConnect)">绑定</el-button>
|
||||
<el-button v-else @click="confirmUnbind(wechatConnect)">解绑</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div :span="4">
|
||||
<el-button v-if="!isBound(wechatConnect.type)" type="primary" @click="openBindModal(wechatConnect)">绑定</el-button>
|
||||
<el-button v-else @click="confirmUnbind(wechatConnect)">解绑</el-button>
|
||||
<div class="connectList">
|
||||
<div class="connectRow">
|
||||
<div class="connectRowLeft">
|
||||
<span class="connectName">{{ wechatConnect.label }}</span>
|
||||
<el-tag v-if="isBound(wechatConnect.type)" color="success">已绑定</el-tag>
|
||||
<el-tag v-else>未绑定</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<el-skeleton size="large" fix v-if="connectLoading"></el-skeleton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</UserCenterLayout>
|
||||
|
||||
<el-dialog
|
||||
v-model="bindModalVisible"
|
||||
@@ -266,12 +269,6 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.safeItem > div:first-child,
|
||||
.safeItem > div:last-child {
|
||||
text-align: center;
|
||||
color: $theme_color;
|
||||
}
|
||||
|
||||
.theme {
|
||||
color: $theme_color;
|
||||
}
|
||||
@@ -281,17 +278,47 @@ export default {
|
||||
}
|
||||
|
||||
.safeItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
border-bottom: 1px solid $border_color;
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
> div {
|
||||
padding: 8px 0;
|
||||
}
|
||||
.safeItem-connect {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.safeItem-main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.safeItem-icon {
|
||||
flex-shrink: 0;
|
||||
width: 56px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: $theme_color;
|
||||
}
|
||||
|
||||
.safeItem-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.safeItem-action {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.connectList {
|
||||
position: relative;
|
||||
margin-top: 8px;
|
||||
margin-left: 72px;
|
||||
}
|
||||
|
||||
.connectRow {
|
||||
|
||||
@@ -1,14 +1,15 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="评论/晒单" />
|
||||
<UserCenterLayout title="评论/晒单" :tabs="['评论/晒单']">
|
||||
|
||||
<div class="order">
|
||||
<div class="order-title">
|
||||
<div class="order-row title">
|
||||
<div span="12">订单详情</div>
|
||||
<div span="10" class="order-detail-title">订单详情</div>
|
||||
<div span="4">收货人</div>
|
||||
<div span="4">评价</div>
|
||||
<div span="6"></div>
|
||||
<div span="4">评价等级</div>
|
||||
<div span="4">评价内容</div>
|
||||
<div span="2"></div>
|
||||
</div>
|
||||
</div>
|
||||
<empty v-if="list.length === 0" />
|
||||
@@ -21,7 +22,7 @@
|
||||
<span class="hover-pointer fontsize_12 eval-detail" @click="evaluateDetail(item.id)">评价详情</span>
|
||||
</div>
|
||||
<div class="order-item-view">
|
||||
<div span="12" class="item-view-name">
|
||||
<div span="10" class="item-view-name">
|
||||
<div class="order-img hover-color" @click="linkTo(`/goodsDetail?goodsId=${item.goodsId}&skuId=${item.skuId}`)">
|
||||
<img :src="item.goodsImage" alt="" />
|
||||
</div>
|
||||
@@ -43,6 +44,7 @@
|
||||
</template>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div span="2"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -52,8 +54,9 @@
|
||||
<div class="page-size">
|
||||
<el-pagination :total="total" @current-change="changePageNum"
|
||||
@size-change="changePageSize"
|
||||
:page-size="params.pageSize" layout="total, sizes, prev, pager, next"></el-pagination>
|
||||
:page-size="params.pageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -158,11 +161,21 @@ export default {
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
> [span='10'] {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
|
||||
> [span='4'] {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
|
||||
> [span='2'] {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
|
||||
> [span='6'] {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
@@ -182,6 +195,10 @@ export default {
|
||||
padding: 10px 0;
|
||||
text-align: center;
|
||||
}
|
||||
.order-detail-title {
|
||||
text-align: left;
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
.content {
|
||||
color: #999;
|
||||
max-height: 60px;
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div class="add-eval">
|
||||
<div class="title">
|
||||
<card _Title="订单投诉" :_Size="16"></card>
|
||||
<UserCenterLayout title="订单投诉" :tabs="['订单投诉']">
|
||||
<div class="title">
|
||||
<p>
|
||||
<span class="fontsize_16 global_color">{{ statusLabel[detail.complainStatus] }}</span>
|
||||
<span class="color999 ml_20">创建时间:</span><span>{{ detail.createTime }}</span>
|
||||
<span class="color999 ml_20">{{ detail.createTime }}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-alert class="l_title" show-icon type="warning">我的申诉信息</el-alert>
|
||||
<table cellspacing="0" cellpadding='0' border="1">
|
||||
@@ -118,6 +118,7 @@
|
||||
<el-dialog title="View Image" v-model="visible">
|
||||
<img :src="previewImage" v-if="visible" style="width: 100%">
|
||||
</el-dialog>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@@ -1,14 +1,15 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="我的投诉" />
|
||||
<UserCenterLayout title="我的投诉" :tabs="['我的投诉']">
|
||||
|
||||
<div class="order">
|
||||
<div class="order-title">
|
||||
<div class="order-row title">
|
||||
<div class="col-12">商品信息</div>
|
||||
<div class="col-4">投诉状态</div>
|
||||
<div class="col-4">投诉主题</div>
|
||||
<div class="col-4">投诉内容</div>
|
||||
<div span="10" class="order-detail-title">商品信息</div>
|
||||
<div span="4">投诉状态</div>
|
||||
<div span="4">投诉主题</div>
|
||||
<div span="4">投诉内容</div>
|
||||
<div span="2"></div>
|
||||
</div>
|
||||
</div>
|
||||
<empty v-if="list.length === 0" />
|
||||
@@ -22,7 +23,7 @@
|
||||
<span class="hover-pointer fontsize_12 eval-detail" style="right: 90px" v-if="item.complainStatus === 'APPLYING' || item.complainStatus === 'NEW'" @click="cancel(item.id)">取消投诉</span>
|
||||
</div>
|
||||
<div class="order-item-view">
|
||||
<div class="col-12 item-view-name">
|
||||
<div span="10" class="item-view-name">
|
||||
<div class="order-img hover-color" @click="linkTo(`/goodsDetail?goodsId=${item.goodsId}&skuId=${item.skuId}`)">
|
||||
<img :src="item.goodsImage" alt="" />
|
||||
</div>
|
||||
@@ -30,11 +31,11 @@
|
||||
{{item.goodsName}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4">{{statusLabel[item.complainStatus]}}</div>
|
||||
<div class="col-4">
|
||||
<div span="4">{{statusLabel[item.complainStatus]}}</div>
|
||||
<div span="4">
|
||||
<div class="content">{{item.complainTopic}}</div>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<div span="4">
|
||||
<el-tooltip>
|
||||
<div class="content">{{item.content}}</div>
|
||||
<template #content>
|
||||
@@ -44,6 +45,7 @@
|
||||
</template>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<div span="2"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -53,8 +55,9 @@
|
||||
<div class="page-size">
|
||||
<el-pagination :total="total" @current-change="changePageNum"
|
||||
@size-change="changePageSize"
|
||||
:page-size="params.pageSize" layout="total, sizes, prev, pager, next"></el-pagination>
|
||||
:page-size="params.pageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -163,29 +166,30 @@ export default {
|
||||
.order-item-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 10px 20px;
|
||||
|
||||
.col-12,
|
||||
.col-4 {
|
||||
> [span] {
|
||||
box-sizing: border-box;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.col-12 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
> [span='10'] {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
|
||||
.col-4 {
|
||||
> [span='4'] {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
|
||||
> [span='2'] {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
}
|
||||
|
||||
.order-item-view {
|
||||
padding: 10px 20px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.order-item {
|
||||
@@ -194,8 +198,13 @@ export default {
|
||||
margin: 10px 0;
|
||||
}
|
||||
.order-row {
|
||||
padding: 10px 0;
|
||||
text-align: center;
|
||||
}
|
||||
.order-detail-title {
|
||||
text-align: left;
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
.content {
|
||||
color: #999;
|
||||
max-height: 60px;
|
||||
@@ -214,6 +223,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.page-size{
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="我的分销" />
|
||||
<UserCenterLayout title="我的分销" :tabs="['我的分销']">
|
||||
<!-- 分销申请 -->
|
||||
|
||||
<div v-if="status === 0">
|
||||
@@ -103,7 +103,6 @@
|
||||
:total="goodsData.total"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
small
|
||||
layout="total, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
@@ -141,7 +140,6 @@
|
||||
:total="goodsData.total"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
small
|
||||
layout="total, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
@@ -178,7 +176,6 @@
|
||||
:total="logData.total"
|
||||
:page-size="logParams.pageSize"
|
||||
@current-change="changePageLog"
|
||||
small
|
||||
layout="total, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
@@ -254,6 +251,7 @@
|
||||
<div class="mt_10" style="margin-top: 100px;">
|
||||
商品链接:<el-input style="width: 600px" v-model="qrcode"></el-input>
|
||||
</div></el-dialog>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -510,8 +508,9 @@ export default {
|
||||
margin: 20px 0;
|
||||
}
|
||||
.page-size {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin: 15px 0px;
|
||||
text-align: right;
|
||||
}
|
||||
.account-price {
|
||||
font-weight: bold;
|
||||
|
||||
@@ -1,40 +1,80 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="近期收藏" :_Tabs="favoriteWay" :_ActiveTab="activeTabIndex" @_Change="change" :_Size="16" v-if="!homePage" />
|
||||
<card _Title="近期收藏" :_Size="16" :_Tabs="favoriteWay" :_ActiveTab="activeTabIndex" @_Change="change" _More="全部收藏" _Src="/home/Favorites" v-else>
|
||||
</card>
|
||||
<div v-if="list.length">
|
||||
<div v-for="(item, index) in list" :key="index">
|
||||
<div class="goodsItem" :key="item.skuId">
|
||||
<div class="goodsImg hover-pointer" v-if="params.type === 'GOODS'">
|
||||
<img :src="item.image" />
|
||||
</div>
|
||||
<div class="goodsImg hover-pointer" v-else>
|
||||
<img :src="item.storeLogo" />
|
||||
</div>
|
||||
<div class="goodsTitle hover-color" v-if="params.type === 'GOODS'" @click="buynow(item.skuId, item.goodsId,item.id)">
|
||||
{{ item.goodsName }}
|
||||
</div>
|
||||
<div v-else class="goodsTitle hover-pointer" @click="buynow(item.skuId, item.goodsId,item.id)" >
|
||||
{{ item.storeName }}
|
||||
<el-tag color="error" class="operated" v-if="item.selfOperated">商家自营</el-tag>
|
||||
</div>
|
||||
<div class="goodsPrice">
|
||||
<span v-if="params.type === 'GOODS'">{{ $filters.unitPrice(item.price, '¥') }}</span>
|
||||
<UserCenterLayout
|
||||
v-if="!homePage"
|
||||
title="近期收藏"
|
||||
:tabs="favoriteWay"
|
||||
:active-tab="activeTabIndex"
|
||||
@tab-change="change"
|
||||
>
|
||||
<div v-if="list.length">
|
||||
<div v-for="(item, index) in list" :key="index">
|
||||
<div class="goodsItem" :key="item.skuId">
|
||||
<div class="goodsImg hover-pointer" v-if="params.type === 'GOODS'">
|
||||
<img :src="item.image" />
|
||||
</div>
|
||||
<div class="goodsImg hover-pointer" v-else>
|
||||
<img :src="item.storeLogo" />
|
||||
</div>
|
||||
<div class="goodsTitle hover-color" v-if="params.type === 'GOODS'" @click="buynow(item.skuId, item.goodsId,item.id)">
|
||||
{{ item.goodsName }}
|
||||
</div>
|
||||
<div v-else class="goodsTitle hover-pointer" @click="buynow(item.skuId, item.goodsId,item.id)" >
|
||||
{{ item.storeName }}
|
||||
<el-tag color="error" class="operated" v-if="item.selfOperated">商家自营</el-tag>
|
||||
</div>
|
||||
<div class="goodsPrice">
|
||||
<span v-if="params.type === 'GOODS'">{{ $filters.unitPrice(item.price, '¥') }}</span>
|
||||
|
||||
</div>
|
||||
<div class="goodsBuy">
|
||||
<el-button size="small" type="primary" @click="buynow(item.skuId, item.goodsId)"
|
||||
v-if="params.type === 'GOODS'">立即购买</el-button>
|
||||
<el-button size="small" type="primary" @click="goShop(item.id)" v-else>店铺购买</el-button>
|
||||
<el-button size="small" v-if="params.type === 'GOODS'" @click="cancel(item.skuId)">取消收藏</el-button>
|
||||
<el-button size="small" v-if="params.type === 'STORE'" @click="cancelStore(item.id)">取消收藏</el-button>
|
||||
</div>
|
||||
<div class="goodsBuy">
|
||||
<el-button size="small" type="primary" @click="buynow(item.skuId, item.goodsId)"
|
||||
v-if="params.type === 'GOODS'">立即购买</el-button>
|
||||
<el-button size="small" type="primary" @click="goShop(item.id)" v-else>店铺购买</el-button>
|
||||
<el-button size="small" v-if="params.type === 'GOODS'" @click="cancel(item.skuId)">取消收藏</el-button>
|
||||
<el-button size="small" v-if="params.type === 'STORE'" @click="cancelStore(item.id)">取消收藏</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-skeleton size="large" fix v-if="spinShow"></el-skeleton>
|
||||
</div>
|
||||
<el-skeleton size="large" fix v-if="spinShow"></el-skeleton>
|
||||
</div>
|
||||
<empty v-else />
|
||||
<empty v-else />
|
||||
</UserCenterLayout>
|
||||
|
||||
<template v-else>
|
||||
<card _Title="近期收藏" :_Size="16" :_Tabs="favoriteWay" :_ActiveTab="activeTabIndex" @_Change="change" _More="全部收藏" _Src="/home/Favorites"></card>
|
||||
<div v-if="list.length">
|
||||
<div v-for="(item, index) in list" :key="index">
|
||||
<div class="goodsItem" :key="item.skuId">
|
||||
<div class="goodsImg hover-pointer" v-if="params.type === 'GOODS'">
|
||||
<img :src="item.image" />
|
||||
</div>
|
||||
<div class="goodsImg hover-pointer" v-else>
|
||||
<img :src="item.storeLogo" />
|
||||
</div>
|
||||
<div class="goodsTitle hover-color" v-if="params.type === 'GOODS'" @click="buynow(item.skuId, item.goodsId,item.id)">
|
||||
{{ item.goodsName }}
|
||||
</div>
|
||||
<div v-else class="goodsTitle hover-pointer" @click="buynow(item.skuId, item.goodsId,item.id)" >
|
||||
{{ item.storeName }}
|
||||
<el-tag color="error" class="operated" v-if="item.selfOperated">商家自营</el-tag>
|
||||
</div>
|
||||
<div class="goodsPrice">
|
||||
<span v-if="params.type === 'GOODS'">{{ $filters.unitPrice(item.price, '¥') }}</span>
|
||||
</div>
|
||||
<div class="goodsBuy">
|
||||
<el-button size="small" type="primary" @click="buynow(item.skuId, item.goodsId)"
|
||||
v-if="params.type === 'GOODS'">立即购买</el-button>
|
||||
<el-button size="small" type="primary" @click="goShop(item.id)" v-else>店铺购买</el-button>
|
||||
<el-button size="small" v-if="params.type === 'GOODS'" @click="cancel(item.skuId)">取消收藏</el-button>
|
||||
<el-button size="small" v-if="params.type === 'STORE'" @click="cancelStore(item.id)">取消收藏</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-skeleton size="large" fix v-if="spinShow"></el-skeleton>
|
||||
</div>
|
||||
<empty v-else />
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -183,14 +223,15 @@ export default {
|
||||
|
||||
.goodsItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
>.goodsImg {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
|
||||
>img {
|
||||
width: 100%;
|
||||
@@ -200,12 +241,15 @@ export default {
|
||||
|
||||
>.goodsPrice,
|
||||
.goodsShop {
|
||||
width: 150px;
|
||||
width: 120px;
|
||||
flex-shrink: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
>.goodsTitle {
|
||||
width: 400px;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
line-height: 60px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@@ -213,10 +257,17 @@ export default {
|
||||
}
|
||||
|
||||
.goodsBuy {
|
||||
margin-left: 80px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
flex-shrink: 0;
|
||||
gap: 8px;
|
||||
width: 170px;
|
||||
margin-left: 16px;
|
||||
line-height: normal;
|
||||
|
||||
>* {
|
||||
margin: 0 4px;
|
||||
:deep(.el-button) {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="memberGrade">
|
||||
<card _Title="我的等级"/>
|
||||
<UserCenterLayout title="我的等级" :tabs="['我的等级']">
|
||||
<div class="summary">
|
||||
<div class="gradeCard">
|
||||
<div class="gradeLeft">
|
||||
@@ -24,7 +24,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-tabs value="rules">
|
||||
<el-tabs v-model="activeGradeTab">
|
||||
<el-tab-pane label="获取经验值方式" name="rules">
|
||||
<el-table v-loading="rulesLoading" :data="ruleList">
|
||||
<el-table-column label="获取方式" min-width="720">
|
||||
@@ -65,17 +65,20 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination style="float:right;margin-top:10px"
|
||||
:current-page="params.pageNumber"
|
||||
:total="experienceLogs.total || 0"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
@size-change="changePageSize"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
small
|
||||
layout="total, prev, pager, next, jumper"></el-pagination>
|
||||
<div class="grade-pagination">
|
||||
<el-pagination
|
||||
:current-page="params.pageNumber"
|
||||
:total="experienceLogs.total || 0"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
@size-change="changePageSize"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
layout="total, prev, pager, next, jumper"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</UserCenterLayout>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -98,6 +101,7 @@ export default {
|
||||
currentExperience: 0,
|
||||
currentGradeId: '',
|
||||
selectedRuleKey: '',
|
||||
activeGradeTab: 'rules',
|
||||
logLoading: false,
|
||||
gradeLoading: false,
|
||||
params: {
|
||||
@@ -405,4 +409,10 @@ h3 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.grade-pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="账户安全"/>
|
||||
<UserCenterLayout title="账户安全" :tabs="['账户安全']">
|
||||
<!-- 手机号验证 -->
|
||||
<el-form ref="formData" :model="formData" label-position="left" label-width="100px" :rules="ruleInLines"
|
||||
v-if="(status == 2 || status == 3) && !showPwd">
|
||||
@@ -69,6 +69,7 @@
|
||||
<div v-if="showPwd" style="text-align: center;width: 50%">
|
||||
<el-button type="primary" class="ml_10" @click="setPassword">设置</el-button>
|
||||
</div>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="point">
|
||||
<card _Title="我的积分"/>
|
||||
<UserCenterLayout title="我的积分" :tabs="['我的积分']">
|
||||
<div class="point-content">
|
||||
<span>剩余积分:<span>{{ pointObj.point || 0 }}</span></span>
|
||||
<span>累计获得:<span>{{ pointObj.totalPoint || 0 }}</span></span>
|
||||
@@ -18,15 +18,18 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页 -->
|
||||
<el-pagination style="float:right;margin-top:10px"
|
||||
:current-page="params.pageNumber"
|
||||
:total="logData.total"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
@size-change="changePageSize"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
small
|
||||
layout="total, prev, pager, next, jumper"></el-pagination>
|
||||
<div class="point-pagination">
|
||||
<el-pagination
|
||||
:current-page="params.pageNumber"
|
||||
:total="logData.total"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
@size-change="changePageSize"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
layout="total, prev, pager, next, jumper"
|
||||
/>
|
||||
</div>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@@ -92,4 +95,10 @@ h3 {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.point-pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,26 +1,33 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<card _Title="用户信息" />
|
||||
<el-form :model="formItem" :rules="rules" ref="form" label-width="80px">
|
||||
<el-form-item label="头像">
|
||||
<el-avatar v-if="formItem.face" :src="formItem.face" :size="80" />
|
||||
<el-avatar v-else :size="80"><el-icon><User /></el-icon></el-avatar>
|
||||
<el-upload
|
||||
:show-upload-list="false"
|
||||
:on-success="handleSuccess"
|
||||
:format="['jpg','jpeg','png']"
|
||||
:action="action"
|
||||
:headers="accessToken"
|
||||
<UserCenterLayout title="用户信息" :tabs="['用户信息']">
|
||||
<el-form :model="formItem" :rules="rules" ref="form" label-width="80px">
|
||||
<el-form-item label="头像" class="avatar-form-item">
|
||||
<div class="avatar-upload">
|
||||
<el-avatar v-if="formItem.face" :src="formItem.face" :size="80" />
|
||||
<el-avatar v-else :size="80"><el-icon><User /></el-icon></el-avatar>
|
||||
<el-upload
|
||||
:show-file-list="false"
|
||||
:on-success="handleSuccess"
|
||||
:format="['jpg','jpeg','png']"
|
||||
:action="action"
|
||||
:headers="accessToken"
|
||||
>
|
||||
<el-button class="mt_10">上传头像</el-button>
|
||||
</el-upload>
|
||||
<el-button>上传头像</el-button>
|
||||
</el-upload>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="昵称" prop="nickName">
|
||||
<el-input class="wrapper-user-name" style="width:187px" v-model="formItem.nickName" placeholder="" />
|
||||
<el-input class="profile-field" v-model="formItem.nickName" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="生日">
|
||||
<el-date-picker type="date" placeholder="选择您的生日" v-model="formItem.birthday"></el-date-picker>
|
||||
<el-date-picker
|
||||
class="profile-field"
|
||||
type="date"
|
||||
placeholder="选择您的生日"
|
||||
v-model="formItem.birthday"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别">
|
||||
<el-radio-group v-model="formItem.sex" type="button" button-style="solid">
|
||||
@@ -32,7 +39,8 @@
|
||||
<el-button type="primary" @click="save">确认修改</el-button>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-form>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -113,5 +121,35 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.avatar-form-item {
|
||||
:deep(.el-form-item__label) {
|
||||
height: 90px;
|
||||
line-height: 90px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-upload {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
|
||||
:deep(.el-avatar) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
:deep(.el-upload) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-field {
|
||||
width: 187px;
|
||||
}
|
||||
|
||||
:deep(.profile-field.el-date-editor) {
|
||||
width: 187px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
<template>
|
||||
<div class="add-eval">
|
||||
<div class="title">
|
||||
<card _Title="订单评价" :_Size="16"></card>
|
||||
<UserCenterLayout title="订单评价" :tabs="['订单评价']">
|
||||
<div class="title">
|
||||
<p>
|
||||
<span class="color999">订单号:</span><span>{{$route.query.sn}}</span>
|
||||
<span class="color999 ml_20" v-if="order.order">{{order.order.paymentTime}}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 物流评分、服务评分 -->
|
||||
<div class="delivery-rate">
|
||||
<div class="fontsize_16">物流服务评价:</div>
|
||||
<div class="color999">
|
||||
<span>物流评价:<el-rate v-model="form.deliveryScore" /></span>
|
||||
<span>服务评价:<el-rate v-model="form.serviceScore" /></span>
|
||||
<span>描述评价:<el-rate v-model="form.descriptionScore" /></span>
|
||||
<div class="color999 rate-list">
|
||||
<span class="rate-item">物流评价:<el-rate v-model="form.deliveryScore" /></span>
|
||||
<span class="rate-item">服务评价:<el-rate v-model="form.serviceScore" /></span>
|
||||
<span class="rate-item">描述评价:<el-rate v-model="form.descriptionScore" /></span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 添加订单评价 左侧商品详情 右侧评价框 -->
|
||||
@@ -26,13 +26,15 @@
|
||||
</div>
|
||||
|
||||
<div class="eval-con">
|
||||
<div>
|
||||
<span class="color999">商品评价:</span>
|
||||
<div class="goods-grade-row">
|
||||
<span class="color999 goods-grade-label">商品评价:</span>
|
||||
<el-radio-group v-model="orderGoods.grade">
|
||||
<el-radio-button value="GOOD">好评</el-radio-button>
|
||||
<el-radio-button value="MODERATE">中评</el-radio-button>
|
||||
<el-radio-button value="WORSE">差评</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div>
|
||||
<el-input type="textarea" maxlength="500" show-word-limit :rows="4" v-model="orderGoods.content" />
|
||||
</div>
|
||||
<div style="display:flex;align-items:center;">
|
||||
@@ -59,10 +61,13 @@
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<el-button type="primary" class="mt_10" :loading="loading" @click="save">发表</el-button>
|
||||
<div class="submit-row">
|
||||
<el-button type="primary" :loading="loading" @click="save">发表</el-button>
|
||||
</div>
|
||||
<el-dialog title="View Image" v-model="visible">
|
||||
<img :src="previewImage" v-if="visible" style="width: 100%">
|
||||
</el-dialog>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@@ -188,6 +193,16 @@ export default {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.rate-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 18px;
|
||||
}
|
||||
.rate-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
.goods-eval li{
|
||||
display: flex;
|
||||
border-bottom: 1px solid #eee;
|
||||
@@ -206,6 +221,20 @@ export default {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
.goods-grade-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.goods-grade-label {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.submit-row {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.demo-upload-list{
|
||||
display: inline-block;
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<div class="add-eval">
|
||||
<div class="title">
|
||||
<card _Title="评价详情" :_Size="16"></card>
|
||||
<UserCenterLayout title="评价详情" :tabs="['评价详情']">
|
||||
<div class="title">
|
||||
<p>
|
||||
<span class="color999">创建人:</span><span>{{ $filters.secrecyMobile( orderGoods.createBy ) }}</span>
|
||||
<span class="color999 ml_20">{{ orderGoods.createTime }}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 物流评分、服务评分 -->
|
||||
<div class="delivery-rate">
|
||||
<div class="fontsize_16">物流服务评价:</div>
|
||||
@@ -84,6 +84,7 @@
|
||||
<el-dialog title="View Image" v-model="visible">
|
||||
<img :src="previewImage" v-if="visible" style="width: 100%" />
|
||||
</el-dialog>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@@ -1,8 +1,13 @@
|
||||
<template>
|
||||
<div class="msg-list">
|
||||
<card _Title="我的消息" :_Tabs="status" :_Size="16" @_Change="statusChange"/>
|
||||
<UserCenterLayout
|
||||
title="我的消息"
|
||||
:tabs="status"
|
||||
:active-tab="activeStatusIndex"
|
||||
@tab-change="statusChange"
|
||||
>
|
||||
|
||||
<el-table v-if="params.status != 'ALREADY_REMOVE'" :data="messageData.records || []">
|
||||
<el-table v-if="params.status != 'ALREADY_REMOVE'" :data="messageData.records || []">
|
||||
<el-table-column prop="title" label="消息标题" align="left" show-overflow-tooltip />
|
||||
<el-table-column prop="content" label="消息内容" align="left" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="发送时间" align="left" width="240" />
|
||||
@@ -18,23 +23,24 @@
|
||||
<el-button type="danger" size="small" @click="removeMessage(row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-table v-else :data="messageData.records || []">
|
||||
</el-table>
|
||||
<el-table v-else :data="messageData.records || []">
|
||||
<el-table-column prop="title" label="消息标题" align="left" show-overflow-tooltip />
|
||||
<el-table-column prop="content" label="消息内容" align="left" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="发送时间" align="left" width="240" />
|
||||
</el-table>
|
||||
<el-pagination
|
||||
style="float:right;margin-top:10px"
|
||||
:current-page="params.pageNumber"
|
||||
:total="messageData.total"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
@size-change="changePageSize"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
small
|
||||
layout="total, prev, pager, next, jumper"
|
||||
/>
|
||||
</el-table>
|
||||
<div class="msg-pagination">
|
||||
<el-pagination
|
||||
:current-page="params.pageNumber"
|
||||
:total="messageData.total"
|
||||
:page-size="params.pageSize"
|
||||
@current-change="changePage"
|
||||
@size-change="changePageSize"
|
||||
:page-sizes="[10, 20, 50]"
|
||||
layout="total, prev, pager, next, jumper"
|
||||
/>
|
||||
</div>
|
||||
</UserCenterLayout>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@@ -51,6 +57,13 @@ export default {
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
activeStatusIndex () {
|
||||
const map = ['UN_READY', 'ALREADY_READY', 'ALREADY_REMOVE'];
|
||||
const index = map.indexOf(this.params.status);
|
||||
return index > -1 ? index : 0;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
statusChange (index) {
|
||||
if (index === 0) { this.params.status = 'UN_READY' }
|
||||
@@ -103,5 +116,9 @@ export default {
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.msg-pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user