feat(jnh): 完善账号管理页面功能

- 添加账号状态显示样式和清除筛选功能
- 为文件上传添加认证头信息
- 增加删除和状态变更确认对话框
- 修复环境变量配置错误

.env.development

@@ -2,10 +2,10 @@
 ENV = development
 
 # 本地环境接口地址
-# VITE_API_URL = http://4155gf93ll13.vicp.fun/admin
+VITE_API_URL = http://4155gf93ll13.vicp.fun/admin
 # VITE_API_URL = http://localhost:13579/admin
 # VITE_API_URL = https://cankao.cs.com.cn/admin
-VITE_API_URL =  http://123.60.153.169:8040/admin
+# VITE_API_URL =  http://123.60.153.169:8040/admin
 
 # VITE_API_URL = /api
 

src/views/pages/jnh/import.vue

@@ -6,7 +6,14 @@
 			<text v-if="errorMsg" style="color: red">{{ errorMsg }}</text>
 			<!-- :http-request="uploadAction" -->
 			<!-- :action="baseUrl + '/jnh/accounts/import'" -->
-			<el-upload class="upload" drag :action="baseUrl + '/jnh/accounts/import'" accept=".xlsx,.xls" :on-success="handleSuccess">
+			<el-upload
+				class="upload"
+				drag
+				:action="baseUrl + '/jnh/accounts/import'"
+				accept=".xlsx,.xls"
+				:headers="uploadHeader"
+				:on-success="handleSuccess"
+			>
 				<div class="upload_text">点击或拖拽文件至此处导入</div>
 				<div class="upload_tips">支持格式.xlsx/.xls，文件大小≤10MB</div>
 			</el-upload>
@@ -26,6 +33,7 @@ import { onMounted, reactive, ref } from 'vue';
 import { NextLoading } from '/@/utils/loading';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import { getUploadUrl } from '/@/api/jnh';
+import { Session } from '/@/utils/storage';
 
 const baseUrl = ref(import.meta.env.VITE_API_UR);
 const emit = defineEmits(['close']);
@@ -37,6 +45,10 @@ const rules = reactive({
 const form = ref({});
 const dialogTableVisible = ref(false);
 
+const uploadHeader = ref({
+	'auth-token': `${Session.get('token')}`,
+});
+
 function open(data) {
 	dialogTableVisible.value = true;
 	if (data) {
@@ -60,6 +72,7 @@ function handleSuccess(res) {
 // 页面加载时
 onMounted(() => {
 	NextLoading.done();
+	baseUrl.value = import.meta.env.VITE_API_URL;
 });
 
 defineExpose({

src/views/pages/jnh/index.vue

@@ -24,7 +24,7 @@
 				</el-form-item>
 
 				<el-form-item label="账号状态" prop="status">
-					<el-select v-model="form.status" placeholder="请选择" class="input" style="width: 150px" @change="getData">
+					<el-select v-model="form.status" placeholder="请选择" class="input" style="width: 150px" @change="getData" clearable @clear="getData">
 						<el-option label="禁用" :value="0" />
 						<el-option label="启用" :value="1" />
 					</el-select>
@@ -37,7 +37,20 @@
 			<el-table-column prop="mobile" label="手机号" align="center" />
 			<el-table-column prop="createTime" label="创建时间" align="center" />
 			<el-table-column prop="updateTime" label="更新时间" align="center" />
-			<el-table-column prop="status" label="账号状态" align="center" />
+			<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="point" style="background-color: #2dc74c"></div>
+							<text style="color: #2dc74c; white-space: nowrap">启用</text>
+						</div>
+						<div class="r_point" v-else>
+							<div class="point" style="background-color: #eb1c5d"></div>
+							<text style="color: #eb1c5d; white-space: nowrap">禁用</text>
+						</div>
+					</div>
+				</template>
+			</el-table-column>
 			<el-table-column label="操作" align="center">
 				<template #default="scope">
 					<el-button type="text" @click="addOpen(scope.row)">编辑</el-button>
@@ -82,36 +95,44 @@ function addImport(data) {
 }
 
 async function getData() {
-	let { code, data } = await getAccounts({
+	let { code, data, total } = await getAccounts({
 		page: tableData.page,
 		size: tableData.size,
 		...form,
 	});
 	if (code == 200) {
-		tableData.data = data.list;
-		tableData.total = data.total;
+		tableData.data = data;
+		tableData.total = total;
 	}
 }
 
 async function doDeleteAccount(row) {
-	let { code, data } = await deleteAccount({
-		id: row.id,
+	ElMessageBox.confirm('确定删除该账号吗？', '提示', {
+		type: 'warning',
+	}).then(async () => {
+		let { code, data } = await deleteAccount({
+			id: row.id,
+		});
+		if (code == 200) {
+			ElMessage.success('删除成功');
+			getData();
+		}
 	});
-	if (code == 200) {
-		ElMessage.success('删除成功');
-		getData();
-	}
 }
 
 async function doUpdateStatus(row) {
-	let { code, data } = await updateStatus({
-		id: row.id,
-		status: row.status == 0 ? 1 : 0,
+	ElMessageBox.confirm('确定' + (row.status == 0 ? '启用' : '禁用') + '该账号吗？', '提示', {
+		type: 'warning',
+	}).then(async () => {
+		let { code, data } = await updateStatus({
+			id: row.id,
+			status: row.status == 0 ? 1 : 0,
+		});
+		if (code == 200) {
+			ElMessage.success('操作成功');
+			getData();
+		}
 	});
-	if (code == 200) {
-		ElMessage.success('操作成功');
-		getData();
-	}
 }
 
 // 页面加载时
@@ -159,4 +180,17 @@ onMounted(() => {
 		display: flex;
 	}
 }
+
+.r_point {
+	display: flex;
+	align-items: center;
+	gap: 3px;
+}
+
+.point {
+	width: 8px;
+	height: 8px;
+	border-radius: 100px;
+	// color: #ffaa48;
+}
 </style>