up

src/views/system/group/components/Group.vue

@@ -101,36 +101,32 @@ defineExpose({
 </script>
 
 <template>
-  <div>
-    <el-dialog v-model="state.dialogVisible" :title="state.title" width="600px" :close-on-click-modal="false" append-to-body destroy-on-close>
-      <div v-loading="state.loading">
-        <el-form ref="formRef" :model="state.formData" :rules="formRules" label-width="120px" label-suffix="：">
-          <el-form-item v-if="state.groupParent" label="上级部门">
-            <el-input v-model="state.formData.parentName" readonly />
-          </el-form-item>
+  <el-drawer v-model="state.dialogVisible" :title="state.title" size="30%">
+    <el-form ref="formRef" :model="state.formData" :rules="formRules" label-width="120px" label-suffix="：">
+      <el-form-item v-if="state.groupParent" label="上级部门">
+        <el-input v-model="state.formData.parentName" readonly />
+      </el-form-item>
 
-          <el-form-item label="部门名称" prop="groupName">
-            <el-input v-model="state.formData.groupName" />
-          </el-form-item>
+      <el-form-item label="部门名称" prop="groupName">
+        <el-input v-model="state.formData.groupName" />
+      </el-form-item>
 
-          <el-form-item label="类别" prop="groupCatId">
-            <group-cat-selector v-model="state.formData.groupCatId" />
-          </el-form-item>
+      <el-form-item label="类别" prop="groupCatId">
+        <group-cat-selector v-model="state.formData.groupCatId" />
+      </el-form-item>
 
-          <el-form-item label="说明">
-            <el-input v-model="state.formData.groupDesc" :rows="5" type="textarea" show-word-limit maxlength="50" />
-          </el-form-item>
-        </el-form>
-      </div>
+      <el-form-item label="说明">
+        <el-input v-model="state.formData.groupDesc" :rows="5" type="textarea" show-word-limit maxlength="50" />
+      </el-form-item>
+    </el-form>
 
-      <template #footer>
-        <el-button size="large" @click="onCancel">
-          取消
-        </el-button>
-        <el-button type="primary" size="large" @click="onSubmit">
-          保存
-        </el-button>
-      </template>
-    </el-dialog>
-  </div>
+    <template #footer>
+      <el-button size="large" @click="onCancel">
+        取消
+      </el-button>
+      <el-button type="primary" size="large" @click="onSubmit">
+        保存
+      </el-button>
+    </template>
+  </el-drawer>
 </template>

src/views/system/group/components/User.vue

@@ -123,52 +123,48 @@ onMounted(() => {})
 </script>
 
 <template>
-  <div>
-    <el-dialog v-model="state.dialogVisible" :title="state.title" width="600px" :close-on-click-modal="false" append-to-body destroy-on-close>
-      <div v-loading="state.loading">
-        <el-form ref="formRef" :model="state.formData" :rules="formRules" label-width="120px" label-suffix="：">
-          <el-form-item label="账号" prop="accountName">
-            <el-input v-model="state.formData.accountName" placeholder="输入账号" />
-          </el-form-item>
-
-          <el-form-item label="所在部门" prop="groupId">
-            <group-selector v-model="state.formData.groupId" />
-          </el-form-item>
-
-          <el-form-item label="密码">
-            <span style="color: #eee">初始化密码为 888888</span>
-          </el-form-item>
-
-          <el-form-item label="姓名" prop="accountRealName">
-            <el-input v-model="state.formData.accountRealName" placeholder="输入姓名" />
-          </el-form-item>
-
-          <el-form-item label="工号" prop="accountStaffNo">
-            <el-input v-model="state.formData.accountStaffNo" max="11" placeholder="输入工号" />
-          </el-form-item>
-
-          <el-form-item v-show="state.formData.isFixed !== 1" label="岗位" prop="positionId">
-            <position-selector v-model="state.formData.positionId" />
-          </el-form-item>
-
-          <el-form-item label="手机号">
-            <el-input v-model="state.formData.accountPhone" max="11" placeholder="输入手机号码" />
-          </el-form-item>
-
-          <el-form-item label="备注">
-            <el-input v-model="state.formData.accountIntro" type="textarea" rows="6" max="127" placeholder="备注" />
-          </el-form-item>
-        </el-form>
-      </div>
-
-      <template #footer>
-        <el-button size="large" @click="onCancel">
-          取消
-        </el-button>
-        <el-button type="primary" size="large" @click="onSubmit">
-          保存
-        </el-button>
-      </template>
-    </el-dialog>
-  </div>
+  <el-drawer v-model="state.dialogVisible" :title="state.title" size="30%">
+    <el-form ref="formRef" :model="state.formData" :rules="formRules" label-width="120px" label-suffix="：">
+      <el-form-item label="账号" prop="accountName">
+        <el-input v-model="state.formData.accountName" placeholder="输入账号" />
+      </el-form-item>
+
+      <el-form-item label="所在部门" prop="groupId">
+        <group-selector v-model="state.formData.groupId" />
+      </el-form-item>
+
+      <el-form-item label="密码">
+        <span style="color: #eee">初始化密码为 888888</span>
+      </el-form-item>
+
+      <el-form-item label="姓名" prop="accountRealName">
+        <el-input v-model="state.formData.accountRealName" placeholder="输入姓名" />
+      </el-form-item>
+
+      <el-form-item label="工号" prop="accountStaffNo">
+        <el-input v-model="state.formData.accountStaffNo" max="11" placeholder="输入工号" />
+      </el-form-item>
+
+      <el-form-item v-show="state.formData.isFixed !== 1" label="岗位" prop="positionId">
+        <position-selector v-model="state.formData.positionId" />
+      </el-form-item>
+
+      <el-form-item label="手机号">
+        <el-input v-model="state.formData.accountPhone" max="11" placeholder="输入手机号码" />
+      </el-form-item>
+
+      <el-form-item label="备注">
+        <el-input v-model="state.formData.accountIntro" type="textarea" rows="6" max="127" placeholder="备注" />
+      </el-form-item>
+    </el-form>
+
+    <template #footer>
+      <el-button size="large" @click="onCancel">
+        取消
+      </el-button>
+      <el-button type="primary" size="large" @click="onSubmit">
+        保存
+      </el-button>
+    </template>
+  </el-drawer>
 </template>