feat: 用户锁定功能对齐 — 锁定筛选/锁定解锁/锁定记录，退款申请原因改为可选

admin-web-new/src/api/custom.ts

@@ -9,3 +9,18 @@ export const getCustomUserList = (params?: object) => {
 export const getRechargeList = (params?: object) => {
   return http.request<any>("get", "/custom/listRecharge", { params });
 };
+
+/** 锁定用户 */
+export const lockUser = (data: { userId: number; lockRemark?: string; lockNotice: string }) => {
+  return http.request<any>("post", "/custom/lockUser", { data });
+};
+
+/** 解锁用户 */
+export const unlockUser = (userId: number) => {
+  return http.request<any>("post", "/custom/unlockUser", { data: { userId } });
+};
+
+/** 用户锁定记录 */
+export const getUserLockRecord = (userId: number) => {
+  return http.request<any>("get", "/custom/listUserLockRecord", { params: { userId } });
+};

admin-web-new/src/api/finance.ts

@@ -30,6 +30,11 @@ export const triggerSettlement = () => {
   return http.request<any>("post", "/finance/triggerSettlement");
 };
 
+/** 发起退款申请 */
+export const applyRefund = (data: { userId: number; reason?: string }) => {
+  return http.request<any>("post", "/finance/applyRefund", { data });
+};
+
 /** 确认结算 */
 export const confirmSettlement = (id: number) => {
   return http.request<any>("post", "/finance/confirmSettlement", { data: { id } });

admin-web-new/src/views/admin/user/index.vue

@@ -1,8 +1,12 @@
 <script setup lang="ts">
 import { reactive, onMounted, ref, nextTick } from "vue";
-import { getCustomUserList } from "@/api/custom";
+import { getCustomUserList, lockUser, unlockUser, getUserLockRecord } from "@/api/custom";
+import { applyRefund } from "@/api/finance";
 import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import { useStationScope } from "@/hooks/useStationScope";
 import { ExtDLabel } from "@/components/ExtForm";
+import { ElMessageBox } from "element-plus";
+import { message } from "@/utils/message";
 import UserDetail from "./detail.vue";
 
 defineOptions({
@@ -17,7 +21,8 @@ const state = reactive({
   formQuery: {
     mobilePhone: "",
     userId: "",
-    stationId: ""
+    stationId: "",
+    locked: null as number | null
   },
   pageQuery: {
     pageNum: 1,
@@ -37,11 +42,31 @@ const state = reactive({
       { label: "洗车次数", prop: "washTimes", width: 90 },
       { label: "消费总额", prop: "amount", width: 120 },
       { label: "状态", prop: "status", width: 80 },
+      { label: "锁定备注", prop: "lockRemark", width: 150 },
+      { label: "锁定次数", prop: "lockTimes", width: 90 },
+      { label: "锁定时间", prop: "lockTime", width: 170 },
       { label: "注册时间", prop: "registerTime", width: 170 }
     ]
+  },
+  lockDialog: {
+    visible: false,
+    loading: false,
+    userId: null as number | null,
+    mobilePhone: "",
+    lockRemark: "",
+    lockNotice: ""
+  },
+  lockRecordDialog: {
+    visible: false,
+    loading: false,
+    mobilePhone: "",
+    list: [] as Array<any>
   }
 });
 
+//站点筛选与全局当前站点联动（回调懒引用，规避 loadData 声明顺序的 TDZ 错误）
+useStationScope(state.formQuery, (refresh?: boolean) => loadData(refresh));
+
 onMounted(() => {
   loadData();
   nextTick(() => {
@@ -56,7 +81,12 @@ const loadData = (refresh: boolean = false) => {
     state.pageQuery.pageNum = 1;
   }
   state.tableData.loading = true;
-  getCustomUserList({ ...state.formQuery, ...state.pageQuery })
+  const params: any = { ...state.formQuery, ...state.pageQuery };
+  //锁定状态未选时不传参，避免空值被绑定为 Integer 报错
+  if (params.locked === "" || params.locked === null || params.locked === undefined) {
+    delete params.locked;
+  }
+  getCustomUserList(params)
     .then((res: any) => {
       const { list, total } = res || {};
       state.tableData.data = list || [];
@@ -88,7 +118,8 @@ const handleReset = () => {
   state.formQuery = {
     mobilePhone: "",
     userId: "",
-    stationId: ""
+    stationId: "",
+    locked: null
   };
   loadData(true);
 };
@@ -100,6 +131,98 @@ const formatMoney = (value: number) => {
 
 const handleDetail = (row: any) => detailRef.value?.open(row);
 
+const handleUserRefundApply = (row: any) => {
+  ElMessageBox.confirm("确认执行本操作吗？", "退款申请", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning"
+  }).then(() => {
+    ElMessageBox.prompt("请输入退款申请原因", "退款申请", {
+      confirmButtonText: "提交",
+      cancelButtonText: "取消",
+      inputType: "textarea",
+      draggable: true
+    })
+      .then(({ value }) => {
+        applyRefund({ userId: row.userId, reason: (value || "").trim() })
+          .then(() => {
+            message("退款已发起", { type: "success" });
+            loadData(true);
+          })
+          .catch(() => {
+            // 错误提示由响应拦截器统一处理
+          });
+      })
+      .catch(() => {});
+  }).catch(() => {});
+};
+
+// 打开锁定用户弹窗
+const openLockDialog = (row: any) => {
+  state.lockDialog.userId = row.userId;
+  state.lockDialog.mobilePhone = row.mobilePhone;
+  state.lockDialog.lockRemark = "";
+  state.lockDialog.lockNotice = "";
+  state.lockDialog.visible = true;
+};
+
+// 提交锁定
+const confirmLockUser = () => {
+  state.lockDialog.loading = true;
+  lockUser({
+    userId: state.lockDialog.userId as number,
+    lockRemark: state.lockDialog.lockRemark,
+    lockNotice: state.lockDialog.lockNotice.trim()
+  })
+    .then(() => {
+      message("锁定成功", { type: "success" });
+      state.lockDialog.visible = false;
+      loadData(true);
+    })
+    .catch(() => {
+      // 错误提示由响应拦截器统一处理
+    })
+    .finally(() => {
+      state.lockDialog.loading = false;
+    });
+};
+
+// 打开锁定记录弹窗
+const openLockRecordDialog = (row: any) => {
+  state.lockRecordDialog.mobilePhone = row.mobilePhone;
+  state.lockRecordDialog.list = [];
+  state.lockRecordDialog.visible = true;
+  state.lockRecordDialog.loading = true;
+  getUserLockRecord(row.userId)
+    .then((res: any) => {
+      state.lockRecordDialog.list = res || [];
+    })
+    .catch(() => {
+      // 错误提示由响应拦截器统一处理
+    })
+    .finally(() => {
+      state.lockRecordDialog.loading = false;
+    });
+};
+
+// 解锁用户
+const handleUnlockUser = (row: any) => {
+  ElMessageBox.confirm(
+    `确认解锁用户『${row.mobilePhone}』？解锁后该用户可正常启动设备与退款`,
+    "提示",
+    {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning"
+    }
+  ).then(() => {
+    unlockUser(row.userId).then(() => {
+      message("解锁成功", { type: "success" });
+      loadData(true);
+    });
+  }).catch(() => {});
+};
+
 const isMoneyField = (prop: string) => {
   return ["balance", "rechargeAmount", "amount"].includes(prop);
 };
@@ -133,6 +256,18 @@ const isMoneyField = (prop: string) => {
             @keyup.enter="handleSearch"
           />
         </el-form-item>
+        <el-form-item label="锁定状态">
+          <el-select
+            v-model="state.formQuery.locked"
+            placeholder="请选择锁定状态"
+            clearable
+            style="width: 150px"
+            @change="handleSearch"
+          >
+            <el-option label="已锁定" :value="1" />
+            <el-option label="未锁定" :value="0" />
+          </el-select>
+        </el-form-item>
         <el-form-item>
           <el-button
             type="primary"
@@ -174,16 +309,52 @@ const isMoneyField = (prop: string) => {
               {{ formatMoney(row[col.prop]) }}
             </template>
             <template v-else-if="col.prop === 'status'">
-              <ExtDLabel type="User.status" :model-value="row.status" />
+              <el-tag v-if="row.lockNotice" type="danger" effect="dark" size="small">锁定</el-tag>
+              <ExtDLabel v-else type="User.status" :model-value="row.status" />
+            </template>
+            <template v-else-if="col.prop === 'lockTimes'">
+              <el-button
+                v-if="row.lockTimes > 0"
+                link
+                type="danger"
+                size="small"
+                @click="openLockRecordDialog(row)"
+              >
+                {{ row.lockTimes }}
+              </el-button>
+              <span v-else>0</span>
             </template>
             <template v-else>
               {{ row[col.prop] }}
             </template>
           </template>
         </el-table-column>
-        <el-table-column label="操作" width="100" fixed="right">
+        <el-table-column label="操作" width="200" fixed="right">
           <template #default="{ row }">
             <el-button type="primary" link size="small" @click="handleDetail(row)">详情</el-button>
+            <el-button type="primary" link size="small" @click="handleUserRefundApply(row)">
+              申请退款
+            </el-button>
+            <el-button
+              v-if="!row.lockNotice"
+              v-auth="'user.lock'"
+              type="danger"
+              link
+              size="small"
+              @click="openLockDialog(row)"
+            >
+              锁定
+            </el-button>
+            <el-button
+              v-else
+              v-auth="'user.lock'"
+              type="success"
+              link
+              size="small"
+              @click="handleUnlockUser(row)"
+            >
+              解锁
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -200,6 +371,97 @@ const isMoneyField = (prop: string) => {
         />
       </div>
     </el-card>
+
+    <!-- 锁定用户弹窗 -->
+    <el-dialog
+      v-model="state.lockDialog.visible"
+      :title="`锁定用户『${state.lockDialog.mobilePhone || ''}』`"
+      width="520px"
+      append-to-body
+      :close-on-click-modal="false"
+    >
+      <el-form label-width="90px" size="default">
+        <el-form-item label="锁定备注">
+          <el-input
+            v-model="state.lockDialog.lockRemark"
+            type="textarea"
+            :rows="2"
+            maxlength="200"
+            show-word-limit
+            placeholder="仅平台人员可见，用于记录锁定原因"
+          />
+        </el-form-item>
+        <el-form-item label="提示内容" required>
+          <el-input
+            v-model="state.lockDialog.lockNotice"
+            type="textarea"
+            :rows="3"
+            maxlength="200"
+            show-word-limit
+            placeholder="用户启动设备时强制弹出展示"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="state.lockDialog.visible = false">取 消</el-button>
+        <el-button
+          :loading="state.lockDialog.loading"
+          :disabled="!state.lockDialog.lockNotice || !state.lockDialog.lockNotice.trim()"
+          type="danger"
+          @click="confirmLockUser"
+        >
+          确定锁定
+        </el-button>
+      </template>
+    </el-dialog>
+
+    <!-- 锁定记录弹窗 -->
+    <el-dialog
+      v-model="state.lockRecordDialog.visible"
+      :title="`锁定记录『${state.lockRecordDialog.mobilePhone || ''}』`"
+      width="900px"
+      append-to-body
+    >
+      <el-table
+        border
+        stripe
+        :data="state.lockRecordDialog.list"
+        v-loading="state.lockRecordDialog.loading"
+        max-height="420"
+      >
+        <template #empty>
+          <el-empty description="暂无锁定记录" />
+        </template>
+        <el-table-column label="序号" type="index" width="60" align="center" />
+        <el-table-column label="锁定时间" prop="lockTime" width="160" align="center" />
+        <el-table-column label="锁定人" prop="lockOperator" width="110" show-overflow-tooltip />
+        <el-table-column
+          label="锁定备注（仅平台人员可见）"
+          prop="lockRemark"
+          min-width="160"
+          show-overflow-tooltip
+        />
+        <el-table-column label="提示内容" prop="lockNotice" min-width="160" show-overflow-tooltip />
+        <el-table-column label="状态" width="90" align="center">
+          <template #default="{ row }">
+            <el-tag v-if="row.status === 1" type="danger" effect="dark" size="small">锁定中</el-tag>
+            <el-tag v-else type="info" size="small">已解锁</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="解锁信息" width="200">
+          <template #default="{ row }">
+            <div v-if="row.unlockTime">{{ row.unlockTime }}</div>
+            <div v-if="row.unlockOperator" class="unlock-operator">
+              解锁人：{{ row.unlockOperator }}
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <template #footer>
+        <el-button @click="state.lockRecordDialog.visible = false">关 闭</el-button>
+      </template>
+    </el-dialog>
+
     <UserDetail ref="detailRef" />
   </div>
 </template>
@@ -220,4 +482,9 @@ const isMoneyField = (prop: string) => {
   justify-content: flex-end;
   margin-top: 15px;
 }
+
+.unlock-operator {
+  color: var(--el-text-color-secondary);
+  font-size: 12px;
+}
 </style>