feat: 添加转发量明细功能，优化数据展示和交互逻辑

src/api/jnh/index.ts

@@ -52,3 +52,12 @@ export const resetPassword = (data: any) => {
 		data,
 	});
 };
+
+// 转发量明细
+export const getShareDetails = (data: any) => {
+	return request({
+		url: '/jnh/user/shares',
+		method: 'get',
+		params: data,
+	});
+};

src/views/pages/jnh/index.vue

@@ -40,12 +40,16 @@
 			<el-table-column prop="department" label="部门" align="center" />
 			<el-table-column prop="createTime" label="创建时间" align="center" />
 			<el-table-column prop="updateTime" label="更新时间" align="center" />
-			<el-table-column prop="shareCount" label="转发量" align="center" />
+			<el-table-column prop="shareCount" label="转发量" align="center">
+				<template #default="scope">
+					<div class="cursor-pointer" @click="handleOpenShare(scope.row)">{{ scope.row.shareCount }}</div>
+				</template>
+			</el-table-column>
 
 			<el-table-column prop="status" label="账号状态" align="center">
 				<template #default="scope">
 					<div style="display: flex; align-items: center; justify-content: center">
-						<div class="r_point" v-if="scope.row.status == 1">
+						<div class="r_point" v-if="scope.row.status == 0">
 							<div class="point" style="background-color: #2dc74c"></div>
 							<text style="color: #2dc74c; white-space: nowrap">启用</text>
 						</div>
@@ -60,7 +64,7 @@
 				<template #default="scope">
 					<el-button type="text" @click="addOpen(scope.row)">编辑</el-button>
 					<el-button type="text" @click="doDeleteAccount(scope.row)">删除</el-button>
-					<el-button type="text" v-if="scope.row.status == 0" @click="doUpdateStatus(scope.row)">启用</el-button>
+					<el-button type="text" v-if="scope.row.status == 1" @click="doUpdateStatus(scope.row)">启用</el-button>
 					<el-button type="text" v-else @click="doUpdateStatus(scope.row)">禁用</el-button>
 				</template>
 			</el-table-column>
@@ -68,13 +72,46 @@
 
 		<addDialog ref="addDialogRef" @close="getData"></addDialog>
 		<importDialog ref="importDialogRef" @close="getData"></importDialog>
+
+		<el-dialog v-model="shareDialogVisible" :title="shareDialogTitle" width="600" :before-close="handleClose">
+			<div>
+				<el-scrollbar max-height="500px">
+					<el-table :data="shareDetailData.data" style="width: 100%" :show-header="false">
+						<el-table-column prop="times" label="次数" align="center" width="80">
+							<template #default="scope">
+								<el-tag type="primary" style="font-weight: 700">{{ scope.row.times }}次</el-tag>
+							</template>
+						</el-table-column>
+						<el-table-column prop="title" label="标题" align="center">
+							<template #default="scope">
+								<div>{{ scope.row.title || '-' }}</div>
+							</template>
+						</el-table-column>
+					</el-table>
+				</el-scrollbar>
+
+				<div class="pagination">
+					<el-pagination
+						size="mini"
+						layout="total, prev, pager, next"
+						prev-text="上一页"
+						next-text="下一页"
+						background
+						v-model:page-size="shareDetailData.size"
+						:total="shareDetailData.total"
+						:pager-count="5"
+						v-model:current-page="shareDetailData.page"
+					/>
+				</div>
+			</div>
+		</el-dialog>
 	</div>
 </template>
 
 <script setup lang="ts" name="loginIndex">
 import { onMounted, ref, reactive } from 'vue';
 import { NextLoading } from '/@/utils/loading';
-import { getAccounts, deleteAccount, updateStatus } from '/@/api/jnh';
+import { getAccounts, deleteAccount, updateStatus, getShareDetails } from '/@/api/jnh';
 import tableComponents from '/@/components/tableComponents/index.vue';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import addDialog from '/@/views/pages/jnh/add.vue';
@@ -126,7 +163,7 @@ async function doDeleteAccount(row) {
 }
 
 async function doUpdateStatus(row) {
-	ElMessageBox.confirm('确定' + (row.status == 0 ? '启用' : '禁用') + '该账号吗？', '提示', {
+	ElMessageBox.confirm('确定' + (row.status == 1 ? '启用' : '禁用') + '该账号吗？', '提示', {
 		type: 'warning',
 	}).then(async () => {
 		let { code, data } = await updateStatus({
@@ -148,6 +185,37 @@ function clearForm() {
 	getData();
 }
 
+// 转发量弹窗
+const shareDialogVisible = ref(false);
+const shareDialogTitle = ref('');
+const shareDetailData = reactive({
+	data: [],
+	total: 0,
+	page: 1,
+	size: 10,
+	loading: false,
+});
+
+function handleOpenShare(playload: any) {
+	shareDialogTitle.value = `${playload.name || '-'}转发明细`;
+	shareDialogVisible.value = true;
+	shareDetailData.loading = true;
+	getShareDetails({ mobile: playload.mobile, page: 1, size: 10 }).then((res) => {
+		shareDetailData.loading = false;
+		const { code, data, total } = res;
+		if (code == 200) {
+			shareDetailData.data = data;
+			shareDetailData.total = total;
+		} else {
+			shareDetailData.data = [];
+			shareDetailData.total = 0;
+		}
+	});
+}
+const handleClose = () => {
+	shareDialogVisible.value = false;
+};
+
 // 页面加载时
 onMounted(() => {
 	NextLoading.done();
@@ -206,4 +274,14 @@ onMounted(() => {
 	border-radius: 100px;
 	// color: #ffaa48;
 }
+
+.cursor-pointer {
+	cursor: pointer;
+	color: #099ed0;
+}
+.pagination {
+	display: flex;
+	justify-content: center;
+	margin-top: 20px;
+}
 </style>