From f853349d1e0299d84d345e9fd2e7d4feccd32d52 Mon Sep 17 00:00:00 2001
From: fengerli <528575642@qq.com>
Date: Fri, 19 Sep 2025 09:33:56 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9mqtt=E6=A0=B9=E6=8D=AE?=
 =?UTF-8?q?=E7=AB=AF=E5=8F=A3=E5=9C=B0=E5=9D=80=EF=BC=8C=E8=B5=B0ws?=
 =?UTF-8?q?=E6=88=96=E8=80=85wss=E5=8D=8F=E8=AE=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                 |   4 +-
 src/layout/components/Navbar.vue |   2 +-
 src/utils/mqtt.ts                | 100 +++++++-------
 src/views/system/user/index.vue  | 223 +++++++++++--------------------
 4 files changed, 131 insertions(+), 198 deletions(-)

diff --git a/.env.development b/.env.development
index c6f3ed1..24e61f8 100644
--- a/.env.development
+++ b/.env.development
@@ -5,8 +5,8 @@ VITE_APP_TITLE = 云平台管理系统
 VITE_APP_ENV = 'development'
 
 # 开发环境
- VITE_APP_BASE_API = 'http://47.120.79.150/backend'
- #VITE_APP_BASE_API = 'http://192.168.2.23:8000'
+ #VITE_APP_BASE_API = 'https://fuyuanshen.com/backend'
+ VITE_APP_BASE_API = 'http://192.168.2.34:8000'
 
 #代永飞接口
 #VITE_APP_BASE_API = 'http://457102h2d6.qicp.vip:24689'   
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index ebc30d0..c50d020 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -20,7 +20,7 @@
           <div class="avatar-wrapper">
             <!-- <img :src="userStore.avatar" class="user-avatar" /> -->
             <img src="@/assets/images/avatar.png" class="user-avatar" />
-            <div style="margin-left: 10px;">{{ useUserStore().nickname }}</div>
+            <div style="margin-left: 10px; white-space: nowrap; font-size: 14px;">{{ useUserStore().nickname }}</div>
             <el-icon><caret-bottom /></el-icon>
           </div>
           <template #dropdown>
diff --git a/src/utils/mqtt.ts b/src/utils/mqtt.ts
index b032c2a..6d0d528 100644
--- a/src/utils/mqtt.ts
+++ b/src/utils/mqtt.ts
@@ -1,4 +1,4 @@
-import { ref, onUnmounted } from 'vue'; // 修复：导入必要的Vue API
+
 import * as Paho from 'paho-mqtt';
 
 // MQTT消息类型定义
@@ -9,61 +9,60 @@ export interface MqttMessage {
   retained: boolean;
   time: Date;
 }
-
 // 订阅选项
 export interface SubscribeOptions {
   qos: 0 | 1 | 2;
 }
 
-// MQTT配置信息
-const MQTT_CONFIG = {
-  // 连接地址（添加协议类型）
-  protocol: 'ws', // 关键：明确协议（ws或wss）
-  host: '47.120.79.150',
-  port: 9083,
-  // 认证信息
-  username: 'admin',
-  password: '#YtvpSfCNG',
-  // 客户端ID（添加时间戳确保唯一性）
-  clientId: `vue3-mqtt-client-${Date.now()}-${Math.random().toString(36).substring(2, 10)}`,
-  // 连接选项
-  cleanSession: true,
-  keepAliveInterval: 60,
-  reconnect: true,
+// 根据当前页面协议自动选择MQTT配置
+const getMqttConfig = () => {
+  // 检测当前页面协议（http: 或 https:）
+  const isHttps = window.location.protocol === 'https:';
+  return {
+    // 自动切换协议：https页面用wss，http页面用ws
+    protocol: isHttps ? 'wss' : 'ws',
+    host: 'www.cnxhyc.com',
+    // 自动切换端口：https对应9084，http对应9083
+    port: isHttps ? 9084 : 9083,
+    // 认证信息
+    username: 'admin',
+    password: '#YtvpSfCNG',
+    clientId: `vue3-mqtt-client-${Date.now()}-${Math.random().toString(36).substring(2, 10)}`,
+    cleanSession: true,
+    keepAliveInterval: 60,
+    reconnect: true,
+  };
 };
+const MQTT_CONFIG = getMqttConfig();
 
 // MQTT客户端组合式API
 export function useMqtt() {
   // 客户端实例
   let client: Paho.Client | null = null;
-  
   // 状态管理（修复：已导入ref）
   const connected = ref(false);
   const connecting = ref(false);
   const error = ref<Error | null>(null);
   const messages = ref<MqttMessage[]>([]);
   const subscribedTopics = ref<string[]>([]);
-  
   // 事件回调
   const connectCallbacks: (() => void)[] = [];
   const messageCallbacks: ((message: MqttMessage) => void)[] = [];
   const errorCallbacks: ((err: Error) => void)[] = [];
   const disconnectCallbacks: (() => void)[] = [];
-  
   // 修复：移除无用的p0参数，connect方法不接受回调（通过onConnect注册）
   const connect = () => {
     if (connected.value || connecting.value) return;
     connecting.value = true;
     error.value = null;
-    
+
     try {
-      // 创建客户端实例（添加协议参数）
       client = new Paho.Client(
-        MQTT_CONFIG.host,
+        MQTT_CONFIG.host, 
         MQTT_CONFIG.port,
         MQTT_CONFIG.clientId
       );
-      
+
       // 设置连接选项
       const connectOptions: Paho.ConnectOptions = {
         userName: MQTT_CONFIG.username,
@@ -71,7 +70,8 @@ export function useMqtt() {
         cleanSession: MQTT_CONFIG.cleanSession,
         keepAliveInterval: MQTT_CONFIG.keepAliveInterval,
         reconnect: MQTT_CONFIG.reconnect,
-        
+        useSSL: MQTT_CONFIG.protocol === 'wss',  // 关键：根据协议自动启用 SSL
+
         // 连接成功回调
         onSuccess: () => {
           console.log('MQTT连接成功');
@@ -79,7 +79,7 @@ export function useMqtt() {
           connecting.value = false;
           connectCallbacks.forEach(cb => cb()); // 触发所有连接成功回调
         },
-        
+
         // 连接失败回调
         onFailure: (err) => {
           console.error('MQTT连接失败:', err);
@@ -89,7 +89,7 @@ export function useMqtt() {
           errorCallbacks.forEach(cb => cb(error.value!));
         }
       };
-      
+
       // 设置客户端回调
       client.onConnectionLost = (responseObject) => {
         if (responseObject.errorCode !== 0) {
@@ -97,12 +97,12 @@ export function useMqtt() {
           error.value = new Error(responseObject.errorMessage || '连接丢失');
           errorCallbacks.forEach(cb => cb(error.value!));
         }
-        
+
         connected.value = false;
         connecting.value = false;
         disconnectCallbacks.forEach(cb => cb());
       };
-      
+
       // 消息接收回调
       client.onMessageArrived = (message) => {
         const newMessage: MqttMessage = {
@@ -112,11 +112,11 @@ export function useMqtt() {
           retained: message.retained,
           time: new Date()
         };
-        
+
         messages.value.push(newMessage);
         messageCallbacks.forEach(cb => cb(newMessage));
       };
-      
+
       // 连接服务器
       client.connect(connectOptions);
     } catch (err) {
@@ -127,18 +127,18 @@ export function useMqtt() {
       errorCallbacks.forEach(cb => cb(error.value!));
     }
   };
-  
+
   // 断开连接
   const disconnect = () => {
     if (!client || !connected.value) return;
-    
+
     client.disconnect();
     client = null;
     connected.value = false;
     subscribedTopics.value = [];
     disconnectCallbacks.forEach(cb => cb());
   };
-  
+
   // 订阅主题
   const subscribe = (topic: string, options: SubscribeOptions): Promise<void> => {
     return new Promise((resolve, reject) => {
@@ -146,12 +146,12 @@ export function useMqtt() {
         reject(new Error('未连接到MQTT服务器'));
         return;
       }
-      
+
       if (subscribedTopics.value.includes(topic)) {
         resolve();
         return;
       }
-      
+
       client.subscribe(topic, {
         qos: options.qos,
         onSuccess: () => {
@@ -166,7 +166,7 @@ export function useMqtt() {
       });
     });
   };
-  
+
   // 取消订阅
   const unsubscribe = (topic: string): Promise<void> => {
     return new Promise((resolve, reject) => {
@@ -174,12 +174,12 @@ export function useMqtt() {
         reject(new Error('未连接到MQTT服务器'));
         return;
       }
-      
+
       if (!subscribedTopics.value.includes(topic)) {
         resolve();
         return;
       }
-      
+
       client.unsubscribe(topic, {
         onSuccess: () => {
           console.log(`取消订阅主题成功: ${topic}`);
@@ -193,7 +193,7 @@ export function useMqtt() {
       });
     });
   };
-  
+
   // 发布消息
   const publish = (
     topic: string,
@@ -205,47 +205,47 @@ export function useMqtt() {
         reject(new Error('未连接到MQTT服务器'));
         return;
       }
-      
+
       if (!topic) {
         reject(new Error('主题不能为空'));
         return;
       }
-      
+
       const message = new Paho.Message(
         typeof payload === 'string' ? payload : payload.toString()
       );
-      
+
       message.destinationName = topic;
       message.qos = options.qos;
       message.retained = options.retained ?? false;
-      
+
       client.send(message);
       resolve();
     });
   };
-  
+
   // 事件注册
   const onConnect = (callback: () => void) => {
     connectCallbacks.push(callback);
   };
-  
+
   const onMessage = (callback: (message: MqttMessage) => void) => {
     messageCallbacks.push(callback);
   };
-  
+
   const onError = (callback: (err: Error) => void) => {
     errorCallbacks.push(callback);
   };
-  
+
   const onDisconnect = (callback: () => void) => {
     disconnectCallbacks.push(callback);
   };
-  
+
   // 组件卸载时断开连接
   onUnmounted(() => {
     disconnect();
   });
-  
+
   return {
     connected,
     connecting,
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index d12aeed..eb659af 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -5,22 +5,14 @@
       <el-col :lg="4" :xs="24" style="">
         <el-card shadow="hover">
           <el-input v-model="deptName" placeholder="请输入部门名称" prefix-icon="Search" clearable />
-          <el-tree
-            ref="deptTreeRef"
-            class="mt-2"
-            node-key="id"
-            :data="deptOptions"
-            :props="{ label: 'label', children: 'children' } as any"
-            :expand-on-click-node="false"
-            :filter-node-method="filterNode"
-            highlight-current
-            default-expand-all
-            @node-click="handleNodeClick"
-          />
+          <el-tree ref="deptTreeRef" class="mt-2" node-key="id" :data="deptOptions"
+            :props="{ label: 'label', children: 'children' } as any" :expand-on-click-node="false"
+            :filter-node-method="filterNode" highlight-current default-expand-all @node-click="handleNodeClick" />
         </el-card>
       </el-col>
       <el-col :lg="20" :xs="24">
-        <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
+        <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
+          :leave-active-class="proxy?.animate.searchAnimate.leave">
           <div v-show="showSearch" class="mb-[10px]">
             <el-card shadow="hover">
               <el-form ref="queryFormRef" :model="queryParams" :inline="true">
@@ -31,24 +23,19 @@
                   <el-input v-model="queryParams.nickName" placeholder="请输入用户昵称" clearable @keyup.enter="handleQuery" />
                 </el-form-item>
                 <el-form-item label="手机号码" prop="phonenumber">
-                  <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable @keyup.enter="handleQuery" />
+                  <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable
+                    @keyup.enter="handleQuery" />
                 </el-form-item>
-
                 <el-form-item label="状态" prop="status">
                   <el-select v-model="queryParams.status" placeholder="用户状态" clearable>
-                    <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+                    <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label"
+                      :value="dict.value" />
                   </el-select>
                 </el-form-item>
                 <el-form-item label="创建时间" style="width: 308px">
-                  <el-date-picker
-                    v-model="dateRange"
-                    value-format="YYYY-MM-DD HH:mm:ss"
-                    type="daterange"
-                    range-separator="-"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                    :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
-                  ></el-date-picker>
+                  <el-date-picker v-model="dateRange" value-format="YYYY-MM-DD HH:mm:ss" type="daterange"
+                    range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
+                    :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"></el-date-picker>
                 </el-form-item>
                 <el-form-item>
                   <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
@@ -63,15 +50,18 @@
           <template #header>
             <el-row :gutter="10">
               <el-col :span="1.5">
-                <el-button v-has-permi="['system:user:add']" type="primary" plain icon="Plus" @click="handleAdd()">新增</el-button>
+                <el-button v-has-permi="['system:user:add']" type="primary" plain icon="Plus"
+                  @click="handleAdd()">新增</el-button>
               </el-col>
               <el-col :span="1.5">
-                <el-button v-has-permi="['system:user:edit']" type="success" plain :disabled="single" icon="Edit" @click="handleUpdate()">
+                <el-button v-has-permi="['system:user:edit']" type="success" plain :disabled="single" icon="Edit"
+                  @click="handleUpdate()">
                   修改
                 </el-button>
               </el-col>
               <el-col :span="1.5">
-                <el-button v-has-permi="['system:user:remove']" type="danger" plain :disabled="multiple" icon="Delete" @click="handleDelete()">
+                <el-button v-has-permi="['system:user:remove']" type="danger" plain :disabled="multiple" icon="Delete"
+                  @click="handleDelete()">
                   删除
                 </el-button>
               </el-col>
@@ -79,32 +69,39 @@
                 <el-dropdown class="mt-[1px]">
                   <el-button plain type="info">
                     更多
-                    <el-icon class="el-icon--right"><arrow-down /></el-icon
-                  ></el-button>
+                    <el-icon class="el-icon--right"><arrow-down /></el-icon></el-button>
                   <template #dropdown>
                     <el-dropdown-menu>
                       <el-dropdown-item icon="Download" @click="importTemplate">下载模板</el-dropdown-item>
                       <!-- 注意 由于el-dropdown-item标签是延迟加载的 所以v-has-permi自定义标签不生效 需要使用v-if调用方法执行 -->
-                      <el-dropdown-item v-if="checkPermi(['system:user:import'])" icon="Top" @click="handleImport">导入数据</el-dropdown-item>
-                      <el-dropdown-item v-if="checkPermi(['system:user:export'])" icon="Download" @click="handleExport">导出数据</el-dropdown-item>
+                      <el-dropdown-item v-if="checkPermi(['system:user:import'])" icon="Top"
+                        @click="handleImport">导入数据</el-dropdown-item>
+                      <el-dropdown-item v-if="checkPermi(['system:user:export'])" icon="Download"
+                        @click="handleExport">导出数据</el-dropdown-item>
                     </el-dropdown-menu>
                   </template>
                 </el-dropdown>
               </el-col>
-              <right-toolbar v-model:show-search="showSearch" :columns="columns" :search="true" @query-table="getList"></right-toolbar>
+              <right-toolbar v-model:show-search="showSearch" :columns="columns" :search="true"
+                @query-table="getList"></right-toolbar>
             </el-row>
           </template>
 
           <el-table v-loading="loading" border :data="userList" @selection-change="handleSelectionChange">
             <el-table-column type="selection" width="50" align="center" />
             <el-table-column v-if="columns[0].visible" key="userId" label="用户编号" align="center" prop="userId" />
-            <el-table-column v-if="columns[1].visible" key="userName" label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" />
-            <el-table-column v-if="columns[2].visible" key="nickName" label="用户昵称" align="center" prop="nickName" :show-overflow-tooltip="true" />
-            <el-table-column v-if="columns[3].visible" key="deptName" label="部门" align="center" prop="deptName" :show-overflow-tooltip="true" />
-            <el-table-column v-if="columns[4].visible" key="phonenumber" label="手机号码" align="center" prop="phonenumber" width="120" />
+            <el-table-column v-if="columns[1].visible" key="userName" label="用户名称" align="center" prop="userName"
+              :show-overflow-tooltip="true" />
+            <el-table-column v-if="columns[2].visible" key="nickName" label="用户昵称" align="center" prop="nickName"
+              :show-overflow-tooltip="true" />
+            <el-table-column v-if="columns[3].visible" key="deptName" label="部门" align="center" prop="deptName"
+              :show-overflow-tooltip="true" />
+            <el-table-column v-if="columns[4].visible" key="phonenumber" label="手机号码" align="center" prop="phonenumber"
+              width="120" />
             <el-table-column v-if="columns[5].visible" key="status" label="状态" align="center">
               <template #default="scope">
-                <el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
+                <el-switch v-model="scope.row.status" active-value="0" inactive-value="1"
+                  @change="handleStatusChange(scope.row)"></el-switch>
               </template>
             </el-table-column>
 
@@ -117,129 +114,85 @@
             <el-table-column label="操作" fixed="right" width="180" class-name="small-padding fixed-width">
               <template #default="scope">
                 <el-tooltip v-if="scope.row.userId !== 1" content="修改" placement="top">
-                  <el-button v-hasPermi="['system:user:edit']" link type="primary" icon="Edit" @click="handleUpdate(scope.row)"></el-button>
+                  <el-button v-hasPermi="['system:user:edit']" link type="primary" icon="Edit"
+                    @click="handleUpdate(scope.row)"></el-button>
                 </el-tooltip>
                 <el-tooltip v-if="scope.row.userId !== 1" content="删除" placement="top">
-                  <el-button v-hasPermi="['system:user:remove']" link type="primary" icon="Delete" @click="handleDelete(scope.row)"></el-button>
+                  <el-button v-hasPermi="['system:user:remove']" link type="primary" icon="Delete"
+                    @click="handleDelete(scope.row)"></el-button>
                 </el-tooltip>
 
                 <el-tooltip v-if="scope.row.userId !== 1" content="重置密码" placement="top">
-                  <el-button v-hasPermi="['system:user:resetPwd']" link type="primary" icon="Key" @click="handleResetPwd(scope.row)"></el-button>
+                  <el-button v-hasPermi="['system:user:resetPwd']" link type="primary" icon="Key"
+                    @click="handleResetPwd(scope.row)"></el-button>
                 </el-tooltip>
 
                 <el-tooltip v-if="scope.row.userId !== 1" content="分配角色" placement="top">
-                  <el-button v-hasPermi="['system:user:edit']" link type="primary" icon="CircleCheck" @click="handleAuthRole(scope.row)"></el-button>
+                  <el-button v-hasPermi="['system:user:edit']" link type="primary" icon="CircleCheck"
+                    @click="handleAuthRole(scope.row)"></el-button>
                 </el-tooltip>
               </template>
             </el-table-column>
           </el-table>
 
-          <pagination
-            v-show="total > 0"
-            v-model:page="queryParams.pageNum"
-            v-model:limit="queryParams.pageSize"
-            :total="total"
-            @pagination="getList"
-          />
+          <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
+            :total="total" @pagination="getList" />
         </el-card>
       </el-col>
     </el-row>
 
     <!-- 添加或修改用户配置对话框 -->
-    <el-dialog ref="formDialogRef" v-model="dialog.visible" :title="dialog.title" width="600px" append-to-body @close="closeDialog">
+    <el-dialog ref="formDialogRef" v-model="dialog.visible" :title="dialog.title" width="600px" append-to-body
+      @close="closeDialog">
       <el-form ref="userFormRef" :model="form" :rules="rules" label-width="80px">
         <el-row>
-          <el-col :span="12">
+          <el-col :span="24">
             <el-form-item label="用户昵称" prop="nickName">
               <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
             </el-form-item>
           </el-col>
-          <el-col :span="12">
+          <el-col :span="24">
             <el-form-item label="归属部门" prop="deptId">
-              <el-tree-select
-                v-model="form.deptId"
-                :data="enabledDeptOptions"
-                :props="{ value: 'id', label: 'label', children: 'children' } as any"
-                value-key="id"
-                placeholder="请选择归属部门"
-                check-strictly
-                @change="handleDeptChange"
-              />
+              <el-tree-select v-model="form.deptId" :data="enabledDeptOptions"
+                :props="{ value: 'id', label: 'label', children: 'children' } as any" value-key="id"
+                placeholder="请选择归属部门" check-strictly @change="handleDeptChange" />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
-          <el-col :span="12">
+          <el-col :span="24">
             <el-form-item label="手机号码" prop="phonenumber">
               <el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
             </el-form-item>
           </el-col>
-          <el-col :span="12">
-            <el-form-item label="邮箱" prop="email">
-              <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
-              <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
-              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="用户性别">
-              <el-select v-model="form.sex" placeholder="请选择">
-                <el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="状态">
-              <el-radio-group v-model="form.status">
-                <el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label }}</el-radio>
-              </el-radio-group>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="岗位">
-              <el-select v-model="form.postIds" multiple placeholder="请选择">
-                <el-option
-                  v-for="item in postOptions"
-                  :key="item.postId"
-                  :label="item.postName"
-                  :value="item.postId"
-                  :disabled="item.status == '1'"
-                ></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
+          <el-col :span="24">
             <el-form-item label="角色" prop="roleIds">
               <el-select v-model="form.roleIds" filterable multiple placeholder="请选择">
-                <el-option
-                  v-for="item in roleOptions"
-                  :key="item.roleId"
-                  :label="item.roleName"
-                  :value="item.roleId"
-                  :disabled="item.status == '1'"
-                ></el-option>
+                <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId"
+                  :disabled="item.status == '1'"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="24">
-            <el-form-item label="备注">
-              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+            <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
+              <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
+              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="状态">
+              <el-radio-group v-model="form.status">
+                <el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
+                  }}</el-radio>
+              </el-radio-group>
             </el-form-item>
           </el-col>
         </el-row>
@@ -254,18 +207,9 @@
 
     <!-- 用户导入对话框 -->
     <el-dialog v-model="upload.open" :title="upload.title" width="400px" append-to-body>
-      <el-upload
-        ref="uploadRef"
-        :limit="1"
-        accept=".xlsx, .xls"
-        :headers="upload.headers"
-        :action="upload.url + '?updateSupport=' + upload.updateSupport"
-        :disabled="upload.isUploading"
-        :on-progress="handleFileUploadProgress"
-        :on-success="handleFileSuccess"
-        :auto-upload="false"
-        drag
-      >
+      <el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
+        :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
+        :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
         <el-icon class="el-icon--upload">
           <i-ep-upload-filled />
         </el-icon>
@@ -274,7 +218,8 @@
           <div class="text-center el-upload__tip">
             <div class="el-upload__tip"><el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据</div>
             <span>仅允许导入xls、xlsx格式文件。</span>
-            <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
+            <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
+              @click="importTemplate">下载模板</el-link>
           </div>
         </template>
       </el-upload>
@@ -294,11 +239,9 @@ import { UserForm, UserQuery, UserVO } from '@/api/system/user/types';
 import { DeptTreeVO, DeptVO } from '@/api/system/dept/types';
 import { RoleVO } from '@/api/system/role/types';
 import { PostQuery, PostVO } from '@/api/system/post/types';
-import { treeselect } from '@/api/system/dept';
 import { globalHeaders } from '@/utils/request';
 import { to } from 'await-to-js';
 import { optionselect } from '@/api/system/post';
-import { hasPermi } from '@/directive/permission';
 import { checkPermi } from '@/utils/permission';
 
 const router = useRouter();
@@ -362,10 +305,7 @@ const initFormData: UserForm = {
   nickName: undefined,
   password: '',
   phonenumber: undefined,
-  email: undefined,
-  sex: undefined,
   status: '0',
-  remark: '',
   postIds: [],
   roleIds: []
 };
@@ -402,13 +342,6 @@ const initData: PageData<UserForm, UserQuery> = {
       },
       { pattern: /^[^<>"'|\\]+$/, message: '不能包含非法字符：< > " \' \\ |', trigger: 'blur' }
     ],
-    email: [
-      {
-        type: 'email',
-        message: '请输入正确的邮箱地址',
-        trigger: ['blur', 'change']
-      }
-    ],
     phonenumber: [
       {
         pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,