zant-admin 2.0.0 → 2.0.2

package/src/components/edit/SysDictItemEdit.vue

@@ -1,136 +1,136 @@
-<template>
-  <a-drawer
-    :title="editTitle"
-    :width="540"
-    :open="open"
-    :body-style="{ paddingBottom: '80px' }"
-    :footer-style="{ textAlign: 'right' }"
-    @close="onClose"
-    :destroyOnClose="true"
-  >
-    <a-form :model="formInfo" ref="formRef" layout="vertical">
-      <a-form-item
-        label="字典标签"
-        name="label"
-        :rules="[{ required: true, message: '字典标签不能为空' }]"
-      >
-        <a-input
-          :class="formInfo.colorClass"
-          v-model:value="formInfo.label"
-          placeholder="请输入"
-        />
-      </a-form-item>
-      <a-form-item label="字典值" name="value">
-        <a-input-number v-model:value="formInfo.value" placeholder="请输入" />
-      </a-form-item>
-      <a-form-item label="颜色样式" name="colorClass">
-        <a-select v-model:value="formInfo.colorClass" @change="selectColor">
-          <a-select-option value="default">default</a-select-option>
-          <a-select-option value="text-color-primary">primary</a-select-option>
-          <a-select-option value="text-color-success">success</a-select-option>
-          <a-select-option value="text-color-warning">warning</a-select-option>
-          <a-select-option value="text-color-error">error</a-select-option>
-          <a-select-option value="text-color-gray">gray</a-select-option>
-          <a-select-option value="text-color-textgray"
-            >textgray</a-select-option
-          >
-        </a-select>
-      </a-form-item>
-      <a-form-item label="排序" name="sort">
-        <a-input-number v-model:value="formInfo.sort" placeholder="请输入" />
-      </a-form-item>
-      <a-form-item label="是否启用" name="isEnable">
-        <a-switch v-model:checked="formInfo.isEnable" />
-      </a-form-item>
-      <a-form-item label="备注" name="remark">
-        <a-textarea v-model:value="formInfo.remark" />
-      </a-form-item>
-    </a-form>
-    <template #extra>
-      <a-space>
-        <a-button type="primary" @click="onSave" :loading="loading"
-          >保存</a-button
-        >
-        <a-button @click="resetForm">重置</a-button>
-      </a-space>
-    </template>
-  </a-drawer>
-</template>
-<script setup>
-import { defineProps, defineEmits, ref, reactive } from 'vue'
-import { message } from 'ant-design-vue'
-import sysDictItem from '@/api/methods/sysDictItem'
-import useFormCRUD from '@/utils/useFormCRUD'
-const props = defineProps({
-  open: {
-    type: Boolean,
-    required: true,
-  },
-  recordwhere: {
-    type: Object,
-    default: {},
-  },
-})
-const defaultformInfo = {
-  id: null,
-  dictId: props.recordwhere.dictId,
-  label: '',
-  colorClass: 'default',
-  value: 0,
-  sort: 0,
-  isEnable: true,
-  remark: '',
-}
-// 使用 reactive 定义表单状态
-const formInfo = reactive({ ...defaultformInfo })
-const editTitle = ref('新增')
-const formRef = ref(null)
-// 定义 emits，用于触发关闭事件
-const emit = defineEmits(['close', 'updateData'])
-/**
- * 重置表单到默认值
- */
-const resetForm = () => {
-  Object.assign(formInfo, defaultformInfo)
-  formRef.value?.resetFields()
-}
-const { loading, save } = useFormCRUD(sysDictItem)
-
-const init = async id => {
-  const isEdit = !!id
-  editTitle.value = isEdit ? '修改' : '新增'
-  if (isEdit) {
-    try {
-      const res = await sysDictItem.get({ id })
-      Object.assign(formInfo, res.data)
-    } catch (error) {
-      message.error('获取信息失败，请重试')
-    }
-  } else {
-    console.log('ss' + props.recordwhere)
-    resetForm()
-  }
-}
-
-const onSave = async () => {
-  await save(formRef.value, formInfo, {
-    onSuccess: () => {
-      emit('updateData')
-      onClose()
-    },
-  })
-}
-
-const selectColor = e => {
-  console.log(e)
-  formInfo.colorClass = e
-}
-
-const onClose = () => {
-  emit('close')
-}
-// 使用 defineExpose 暴露方法
-defineExpose({
-  init,
-})
-</script>
+<template>
+  <a-drawer
+    :title="editTitle"
+    :width="540"
+    :open="open"
+    :body-style="{ paddingBottom: '80px' }"
+    :footer-style="{ textAlign: 'right' }"
+    @close="onClose"
+    :destroyOnClose="true"
+  >
+    <a-form :model="formInfo" ref="formRef" layout="vertical">
+      <a-form-item
+        label="字典标签"
+        name="label"
+        :rules="[{ required: true, message: '字典标签不能为空' }]"
+      >
+        <a-input
+          :class="formInfo.colorClass"
+          v-model:value="formInfo.label"
+          placeholder="请输入"
+        />
+      </a-form-item>
+      <a-form-item label="字典值" name="value">
+        <a-input-number v-model:value="formInfo.value" placeholder="请输入" />
+      </a-form-item>
+      <a-form-item label="颜色样式" name="colorClass">
+        <a-select v-model:value="formInfo.colorClass" @change="selectColor">
+          <a-select-option value="default">default</a-select-option>
+          <a-select-option value="text-color-primary">primary</a-select-option>
+          <a-select-option value="text-color-success">success</a-select-option>
+          <a-select-option value="text-color-warning">warning</a-select-option>
+          <a-select-option value="text-color-error">error</a-select-option>
+          <a-select-option value="text-color-gray">gray</a-select-option>
+          <a-select-option value="text-color-textgray"
+            >textgray</a-select-option
+          >
+        </a-select>
+      </a-form-item>
+      <a-form-item label="排序" name="sort">
+        <a-input-number v-model:value="formInfo.sort" placeholder="请输入" />
+      </a-form-item>
+      <a-form-item label="是否启用" name="isEnable">
+        <a-switch v-model:checked="formInfo.isEnable" />
+      </a-form-item>
+      <a-form-item label="备注" name="remark">
+        <a-textarea v-model:value="formInfo.remark" />
+      </a-form-item>
+    </a-form>
+    <template #extra>
+      <a-space>
+        <a-button type="primary" @click="onSave" :loading="loading"
+          >保存</a-button
+        >
+        <a-button @click="resetForm">重置</a-button>
+      </a-space>
+    </template>
+  </a-drawer>
+</template>
+<script setup>
+import { defineProps, defineEmits, ref, reactive } from 'vue'
+import { message } from 'ant-design-vue'
+import sysDictItem from '@/api/methods/sysDictItem'
+import useFormCRUD from '@/utils/useFormCRUD'
+const props = defineProps({
+  open: {
+    type: Boolean,
+    required: true,
+  },
+  recordwhere: {
+    type: Object,
+    default: {},
+  },
+})
+const defaultformInfo = {
+  id: null,
+  dictId: props.recordwhere.dictId,
+  label: '',
+  colorClass: 'default',
+  value: 0,
+  sort: 0,
+  isEnable: true,
+  remark: '',
+}
+// 使用 reactive 定义表单状态
+const formInfo = reactive({ ...defaultformInfo })
+const editTitle = ref('新增')
+const formRef = ref(null)
+// 定义 emits，用于触发关闭事件
+const emit = defineEmits(['close', 'updateData'])
+/**
+ * 重置表单到默认值
+ */
+const resetForm = () => {
+  Object.assign(formInfo, defaultformInfo)
+  formRef.value?.resetFields()
+}
+const { loading, save } = useFormCRUD(sysDictItem)
+
+const init = async id => {
+  const isEdit = !!id
+  editTitle.value = isEdit ? '修改' : '新增'
+  if (isEdit) {
+    try {
+      const res = await sysDictItem.get({ id })
+      Object.assign(formInfo, res.data)
+    } catch (error) {
+      message.error('获取信息失败，请重试')
+    }
+  } else {
+    console.log('ss' + props.recordwhere)
+    resetForm()
+  }
+}
+
+const onSave = async () => {
+  await save(formRef.value, formInfo, {
+    onSuccess: () => {
+      emit('updateData')
+      onClose()
+    },
+  })
+}
+
+const selectColor = e => {
+  console.log(e)
+  formInfo.colorClass = e
+}
+
+const onClose = () => {
+  emit('close')
+}
+// 使用 defineExpose 暴露方法
+defineExpose({
+  init,
+})
+</script>

package/src/components/edit/SysRoleEdit.vue

@@ -1,111 +1,111 @@
-<template>
-  <a-drawer
-    :title="editTitle"
-    :width="540"
-    :open="open"
-    :body-style="{ paddingBottom: '80px' }"
-    :footer-style="{ textAlign: 'right' }"
-    @close="onClose"
-    :destroyOnClose="true"
-  >
-    <a-form :model="formInfo" ref="formRef" layout="vertical">
-      <a-form-item
-        label="角色名称"
-        name="name"
-        :rules="[{ required: true, message: '角色名称不能为空' }]"
-      >
-        <a-input v-model:value="formInfo.name" placeholder="请输入" />
-      </a-form-item>
-      <a-form-item label="是否启用" name="isEnable">
-        <a-switch v-model:checked="formInfo.isEnable" />
-      </a-form-item>
-      <a-form-item label="备注" name="remark">
-        <a-textarea v-model:value="formInfo.remark" />
-      </a-form-item>
-    </a-form>
-    <template #extra>
-      <a-space>
-        <a-button type="primary" @click="onSave" :loading="loading"
-          >保存</a-button
-        >
-        <a-button @click="resetForm">重置</a-button>
-      </a-space>
-    </template>
-  </a-drawer>
-</template>
-<script setup>
-import { defineProps, defineEmits, ref, reactive } from 'vue'
-import { message } from 'ant-design-vue'
-import sysRole from '@/api/methods/sysRole'
-import useFormCRUD from '@/utils/useFormCRUD'
-const props = defineProps({
-  open: {
-    type: Boolean,
-    required: true,
-  },
-})
-// 表单字段的默认值
-const defaultformInfo = {
-  id: null,
-  name: '',
-  isEnable: true,
-  remark: '',
-}
-// 响应式数据
-const formInfo = reactive({ ...defaultformInfo })
-const editTitle = ref('新增')
-const formRef = ref(null)
-// 定义 emits，用于触发关闭事件
-const emit = defineEmits(['close', 'updateData'])
-
-/**
- * 重置表单到默认值
- */
-const resetForm = () => {
-  Object.assign(formInfo, defaultformInfo)
-  formRef.value?.resetFields()
-}
-const { loading, save } = useFormCRUD(sysRole)
-/**
- * 初始化角色编辑表单
- * @param {number} id - 角色ID，如果为0或空则表示新增角色
- */
-const init = async id => {
-  const isEdit = !!id
-  editTitle.value = isEdit ? '修改' : '新增'
-
-  if (isEdit) {
-    try {
-      const res = await sysRole.get({ id })
-      Object.assign(formInfo, res.data)
-    } catch (error) {
-      message.error('获取信息失败，请重试')
-    }
-  } else {
-    resetForm()
-  }
-}
-
-/**
- * 保存角色信息
- * 处理表单验证和角色新增/修改操作
- */
-const onSave = async () => {
-  await save(formRef.value, formInfo, {
-    onSuccess: () => {
-      emit('updateData')
-      onClose()
-    },
-  })
-}
-/**
- * 关闭抽屉组件
- * 触发关闭事件并通知父组件
- */
-const onClose = () => {
-  resetForm()
-  emit('close')
-}
-// 使用 defineExpose 暴露方法
-defineExpose({ init })
-</script>
+<template>
+  <a-drawer
+    :title="editTitle"
+    :width="540"
+    :open="open"
+    :body-style="{ paddingBottom: '80px' }"
+    :footer-style="{ textAlign: 'right' }"
+    @close="onClose"
+    :destroyOnClose="true"
+  >
+    <a-form :model="formInfo" ref="formRef" layout="vertical">
+      <a-form-item
+        label="角色名称"
+        name="name"
+        :rules="[{ required: true, message: '角色名称不能为空' }]"
+      >
+        <a-input v-model:value="formInfo.name" placeholder="请输入" />
+      </a-form-item>
+      <a-form-item label="是否启用" name="isEnable">
+        <a-switch v-model:checked="formInfo.isEnable" />
+      </a-form-item>
+      <a-form-item label="备注" name="remark">
+        <a-textarea v-model:value="formInfo.remark" />
+      </a-form-item>
+    </a-form>
+    <template #extra>
+      <a-space>
+        <a-button type="primary" @click="onSave" :loading="loading"
+          >保存</a-button
+        >
+        <a-button @click="resetForm">重置</a-button>
+      </a-space>
+    </template>
+  </a-drawer>
+</template>
+<script setup>
+import { defineProps, defineEmits, ref, reactive } from 'vue'
+import { message } from 'ant-design-vue'
+import sysRole from '@/api/methods/sysRole'
+import useFormCRUD from '@/utils/useFormCRUD'
+const props = defineProps({
+  open: {
+    type: Boolean,
+    required: true,
+  },
+})
+// 表单字段的默认值
+const defaultformInfo = {
+  id: null,
+  name: '',
+  isEnable: true,
+  remark: '',
+}
+// 响应式数据
+const formInfo = reactive({ ...defaultformInfo })
+const editTitle = ref('新增')
+const formRef = ref(null)
+// 定义 emits，用于触发关闭事件
+const emit = defineEmits(['close', 'updateData'])
+
+/**
+ * 重置表单到默认值
+ */
+const resetForm = () => {
+  Object.assign(formInfo, defaultformInfo)
+  formRef.value?.resetFields()
+}
+const { loading, save } = useFormCRUD(sysRole)
+/**
+ * 初始化角色编辑表单
+ * @param {number} id - 角色ID，如果为0或空则表示新增角色
+ */
+const init = async id => {
+  const isEdit = !!id
+  editTitle.value = isEdit ? '修改' : '新增'
+
+  if (isEdit) {
+    try {
+      const res = await sysRole.get({ id })
+      Object.assign(formInfo, res.data)
+    } catch (error) {
+      message.error('获取信息失败，请重试')
+    }
+  } else {
+    resetForm()
+  }
+}
+
+/**
+ * 保存角色信息
+ * 处理表单验证和角色新增/修改操作
+ */
+const onSave = async () => {
+  await save(formRef.value, formInfo, {
+    onSuccess: () => {
+      emit('updateData')
+      onClose()
+    },
+  })
+}
+/**
+ * 关闭抽屉组件
+ * 触发关闭事件并通知父组件
+ */
+const onClose = () => {
+  resetForm()
+  emit('close')
+}
+// 使用 defineExpose 暴露方法
+defineExpose({ init })
+</script>

package/src/components/edit/organizationalStructure/DepartmentEdit.vue

@@ -0,0 +1,162 @@
+<template>
+  <a-drawer
+    :title="editTitle"
+    :width="540"
+    :open="open"
+    :body-style="{ paddingBottom: '80px' }"
+    :footer-style="{ textAlign: 'right' }"
+    @close="onClose"
+    :destroyOnClose="true"
+  >
+    <a-skeleton :loading="initloading" active>
+
+      <a-form :model="formInfo" ref="formRef" layout="vertical" >
+         <a-form-item label="上级组织" name="parentId">
+          <a-tree-select
+            v-model:value="formInfo.parentId"
+            show-search
+            style="width: 100%"
+            :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+            placeholder="请选择"
+            allow-clear
+            tree-default-expand-all
+            :tree-data="orgTree"
+             tree-node-filter-prop="label"
+
+          />
+        </a-form-item>
+        <a-form-item label="组织名称" name="name"  :rules="[{ required: true, message: '请输入组织名称' }]">
+          <a-input v-model:value="formInfo.name" placeholder="请输入" />
+        </a-form-item>
+
+        <a-form-item label="组织类型" name="orgType">
+          <a-select
+            v-model:value="formInfo.orgType"
+            placeholder="请选择"
+            :options="orgTypeOptions"
+          />
+        </a-form-item>
+
+
+        <a-form-item label="排序序号" name="sort">
+          <a-input-number
+            v-model:value="formInfo.sort"
+            :min="0"
+            style="width: 100%"
+            placeholder="请输入"
+          />
+        </a-form-item>
+        <a-form-item label="是否启用" name="isEnable">
+          <a-switch v-model:checked="formInfo.isEnable" />
+        </a-form-item>
+      </a-form>
+    </a-skeleton>
+    <template #extra>
+      <a-space>
+        <a-button type="primary" @click="onSave" :loading="loading">保存</a-button>
+        <a-button @click="resetForm">重置</a-button>
+      </a-space>
+    </template>
+  </a-drawer>
+</template>
+<script setup>
+import { defineProps, defineEmits, ref, reactive } from 'vue'
+import { message } from 'ant-design-vue'
+import department from '@/api/methods/department'
+import useFormCRUD from '@/utils/useFormCRUD'
+
+const props = defineProps({
+  open: {
+    type: Boolean,
+    required: true,
+  },
+})
+
+const orgTypeOptions = [
+  { label: '公司', value: 1 },
+  { label: '部门', value: 2 },
+  { label: '小组', value: 3 },
+  { label: '虚拟团队', value: 4 },
+]
+
+const defaultformInfo = {
+  id: null,
+  parentId: "0",
+  ancestors: '',
+  name: '',
+  orgType: 1,
+  sort: 0,
+  isEnable: true,
+}
+
+const formInfo = reactive({ ...defaultformInfo })
+const editTitle = ref('新增')
+const formRef = ref(null)
+const orgTree = ref([])
+const emit = defineEmits(['close', 'updateData'])
+const { loading, save } = useFormCRUD(department)
+
+const resetForm = () => {
+  Object.assign(formInfo, defaultformInfo)
+  formRef.value?.resetFields()
+}
+
+const initloading = ref(false)
+
+const init = async id => {
+  initloading.value = true
+  const isEdit = !!id
+  editTitle.value = isEdit ? '修改' : '新增'
+
+  if (isEdit) {
+    try {
+      const res = await department.get({ id })
+      initloading.value = false
+      Object.assign(formInfo, res.data)
+    } catch (error) {
+      message.error('获取信息失败，请重试')
+      initloading.value = false
+    }
+  } else {
+    initloading.value = false
+    resetForm()
+  }
+}
+
+const onSave = async () => {
+  await save(formRef.value, formInfo, {
+    onSuccess: () => {
+      emit('updateData')
+      onClose()
+    },
+  })
+}
+
+const onClose = () => {
+  resetForm()
+  emit('close')
+}
+///获取组织树
+const getOrgTree = async () => {
+  try {
+    const res = await department.getTreeSelectdepartment()
+    orgTree.value = res.data
+  } catch (error) {}
+}
+
+// 添加下级
+const addSubOrg = record => {
+  editTitle.value = '新增下级'
+  resetForm()
+  formInfo.id = null
+  formInfo.parentId = record.id
+  formInfo.ancestors = record.ancestors
+  formInfo.sort = record.sort
+}
+
+defineExpose({
+  init,
+  getOrgTree,
+  addSubOrg
+})
+</script>