完成小程序端我的模块跳转我的地址

pull/76/head
riverflow 1 month ago
parent 5aad968993
commit 8ee5146eff

@ -5,11 +5,18 @@ import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page; import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.itmk.web.goods_comment.entity.GoodsComment; import com.itmk.web.goods_comment.entity.GoodsComment;
import org.apache.ibatis.annotations.Param; import org.apache.ibatis.annotations.Param;
import org.apache.ibatis.annotations.Select;
import java.util.List; import java.util.List;
public interface GoodsCommentMapper extends BaseMapper<GoodsComment> { public interface GoodsCommentMapper extends BaseMapper<GoodsComment> {
List<GoodsComment> commentList(@Param("goodsId") Long goodsId); List<GoodsComment> commentList(@Param("goodsId") Long goodsId);
// 修改getList方法关联查询用户信息
@Select("SELECT gc.*, wu.nick_name as nickName, wu.avatar_url as avatarUrl " +
"FROM goods_comment gc " +
"LEFT JOIN wx_user wu ON gc.openid = wu.openid " +
"ORDER BY gc.create_time DESC")
IPage<GoodsComment> getList(Page<GoodsComment> page); IPage<GoodsComment> getList(Page<GoodsComment> page);
} }

@ -1,4 +1,5 @@
package com.itmk.web.goods_comment.service.impl; package com.itmk.web.goods_comment.service.impl;
import com.baomidou.mybatisplus.core.metadata.IPage; import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page; import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl; import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
@ -10,7 +11,6 @@ import org.springframework.stereotype.Service;
import java.util.List; import java.util.List;
@Service @Service
public class GoodsCommentServiceImpl extends ServiceImpl<GoodsCommentMapper, GoodsComment> implements GoodsCommentService { public class GoodsCommentServiceImpl extends ServiceImpl<GoodsCommentMapper, GoodsComment> implements GoodsCommentService {
@Override @Override
@ -21,7 +21,7 @@ public class GoodsCommentServiceImpl extends ServiceImpl<GoodsCommentMapper, Goo
@Override @Override
public IPage<GoodsComment> getList(CommentParm parm) { public IPage<GoodsComment> getList(CommentParm parm) {
//构造分页对象 //构造分页对象
Page<GoodsComment> page = new Page<>(parm.getCurrentPage(),parm.getPageSize()); Page<GoodsComment> page = new Page<>(parm.getCurrentPage(), parm.getPageSize());
return this.baseMapper.getList(page); return this.baseMapper.getList(page);
} }
} }

@ -19,7 +19,7 @@
<u-cell-group> <u-cell-group>
<u-cell-item @click="toOrder" icon="star" title="我的订单"></u-cell-item> <u-cell-item @click="toOrder" icon="star" title="我的订单"></u-cell-item>
<u-cell-item @click="toCollect" icon="photo" title="我的收藏"></u-cell-item> <u-cell-item @click="toCollect" icon="photo" title="我的收藏"></u-cell-item>
<u-cell-item icon="coupon" title="我的地址"></u-cell-item> <u-cell-item @click="toAddresslist" icon="coupon" title="我的地址"></u-cell-item>
</u-cell-group> </u-cell-group>
</view> </view>
</view> </view>
@ -240,6 +240,13 @@
url: '../collect/collect' url: '../collect/collect'
}); });
} }
//
const toAddresslist = () => {
uni.navigateTo({
url: '../addresslist/addresslist'
});
}
onShow(() => { onShow(() => {
userLogin() userLogin()

@ -3,4 +3,18 @@ export type CommentListParm = {
currentPage:number; currentPage:number;
pageSize:number; pageSize:number;
total:number; //分页的总条数 total:number; //分页的总条数
} }
// 评论项类型
export type CommentItem = {
commentId: number;
goodsId: number;
orderId: number;
openid: string;
commentText: string;
nickName: string;
avatarUrl: string;
createTime: string;
goodsName: string;
goodsImage: string;
}

@ -2,10 +2,11 @@ import http from "../../http";
import type { CommentListParm } from "./CommentModel"; import type { CommentListParm } from "./CommentModel";
//列表 //列表
export const getListApi = (parm:CommentListParm)=>{ export const getListApi = (parm: CommentListParm) => {
return http.get("/wxapi/comment/pcCommentList",parm) return http.get("/wxapi/comment/pcCommentList", parm);
} }
//删除 //删除
export const deleteApi = (commentId:string)=>{ export const deleteApi = (commentId: string) => {
return http.delete(`/wxapi/comment/${commentId}`) return http.delete(`/wxapi/comment/${commentId}`);
} }

@ -1,55 +1,129 @@
<template> <template>
<el-main> <el-main>
<!-- 表格 --> <!-- 表格 -->
<el-table :height="tableHeight" :data="tableList" border stripe> <el-table :height="tableHeight" :data="tableList" border stripe>
<el-table-column label="名称" prop="goodsName"></el-table-column> <el-table-column label="名称" prop="goodsName"></el-table-column>
<el-table-column label="商品图片" prop="goodsImage"> <el-table-column label="商品图片" prop="goodsImage">
<template #default="scope"> <template #default="scope">
<el-image <el-image :src="getGoodsImage(scope.row.goodsImage)"
:src="scope.row.goodsImage.split(',')[0]" style="height: 60px; width: 60px; border-radius: 8px"
style="height: 60px; width: 60px; border-radius: 50%" :preview-src-list="[getGoodsImage(scope.row.goodsImage)]"
></el-image> fit="cover"
</template> hide-on-click-modal
</el-table-column> @error="handleImageError">
<el-table-column label="昵称" prop="nickName"></el-table-column> <template #error>
<el-table-column label="头像" prop="avatarUrl"> <div class="image-error">
<template #default="scope"> <el-icon><Picture /></el-icon>
<el-image </div>
:src="imgUrl+scope.row.avatarUrl" </template>
style="height: 60px; width: 60px; border-radius: 50%" </el-image>
></el-image> </template>
</template> </el-table-column>
</el-table-column> <el-table-column label="昵称" prop="nickName"></el-table-column>
<el-table-column label="时间" prop="createTime"></el-table-column> <el-table-column label="头像" prop="avatarUrl">
<el-table-column label="操作" width="220" align="center"> <template #default="scope">
<template #default="scope"> <el-image :src="getAvatarUrl(scope.row.avatarUrl)"
<el-button :icon="Delete" @click="deleteBtn(scope.row.commentId)" type="danger" size="default">删除</el-button> style="height: 60px; width: 60px; border-radius: 50%"
</template> :preview-src-list="[getAvatarUrl(scope.row.avatarUrl)]"
</el-table-column> fit="cover"
</el-table> hide-on-click-modal
<!-- 分页 --> @error="handleImageError">
<el-pagination <template #error>
@size-change="sizeChange" <div class="image-error">
@current-change="currentChange" <el-icon><User /></el-icon>
:current-page.sync="listParm.currentPage" </div>
:page-sizes="[10,20, 40, 80, 100]" </template>
:page-size="listParm.pageSize" </el-image>
layout="total, sizes, prev, pager, next, jumper" </template>
:total="listParm.total" background> </el-table-column>
</el-pagination> <el-table-column label="评论内容" prop="commentText" width="300">
<template #default="scope">
</el-main> <el-tooltip :content="scope.row.commentText" placement="top">
</template> <div class="comment-text">{{ scope.row.commentText }}</div>
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="时间" prop="createTime" width="160"></el-table-column>
<el-table-column label="操作" width="120" align="center">
<template #default="scope">
<el-button :icon="Delete" @click="deleteBtn(scope.row.commentId)" type="danger" size="default">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination @size-change="sizeChange" @current-change="currentChange" :current-page.sync="listParm.currentPage"
:page-sizes="[10, 20, 40, 80, 100]" :page-size="listParm.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="listParm.total" background>
</el-pagination>
</el-main>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { Delete, Picture, User } from "@element-plus/icons-vue";
import useCommentTable from "../../compositions/comment/useCommentTable";
// URL
const imgUrl = ref('http://localhost:8089/')
//
const { listParm, deleteBtn, tableList, sizeChange, currentChange, tableHeight } = useCommentTable();
// URL
const getAvatarUrl = (url: string) => {
if (!url) return '';
// URLURL
if (url.indexOf('http') === 0 || url.indexOf('https') === 0) return url;
//
return imgUrl.value + url;
}
// URL
const getGoodsImage = (images: string) => {
if (!images) return '';
<script setup lang="ts"> try {
import {ref} from 'vue' const imageArray = images.split(',');
import { Delete } from "@element-plus/icons-vue"; if (imageArray.length > 0) {
import useCommentTable from "../../compositions/comment/useCommentTable"; let firstImage = imageArray[0].trim();
const imgUrl = ref('http://localhost:8089/') if (firstImage.indexOf('http') === 0 || firstImage.indexOf('https') === 0) {
// return firstImage;
const { listParm, deleteBtn, tableList,sizeChange ,currentChange,tableHeight} = useCommentTable(); } else {
return imgUrl.value + firstImage;
</script> }
}
} catch (e) {
console.error('解析商品图片失败:', e);
}
<style scoped></style> return '';
}
//
const handleImageError = (e: any) => {
console.log('图片加载失败', e);
}
//
onMounted(() => {
//
})
</script>
<style scoped>
.image-error {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
background: #f5f7fa;
color: #909399;
border-radius: 50%;
}
.comment-text {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 300px;
}
</style>

@ -4,11 +4,22 @@
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"baseUrl": ".", "baseUrl": ".",
"paths": { "paths": {
"@/*": ["src/*"], "@/*": [
"@/api/*": ["src/api/*"] "src/*"
],
"@/api/*": [
"src/api/*"
]
}, },
"lib": ["ESNext", "DOM", "DOM.Iterable"], "lib": [
"types": ["vite/client"], "ES2015",
"ESNext",
"DOM",
"DOM.Iterable"
],
"types": [
"vite/client"
],
"module": "ESNext", "module": "ESNext",
"moduleResolution": "bundler", "moduleResolution": "bundler",
"target": "ESNext", "target": "ESNext",

Loading…
Cancel
Save