视频预警

2025-08-12 13:51:35 +08:00
parent 0a77934d8b
commit 1d1afb0162
22 changed files with 2260 additions and 379 deletions
--- a/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/arrangement-modal.vue
+++ b/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/arrangement-modal.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { reactive, onMounted } from 'vue';
+import { reactive, onMounted, computed } from 'vue';

 import { useVbenModal } from '@vben/common-ui';

@@ -60,7 +60,7 @@ const rules = {
 const groupOptions = ref<any[]>([]);
 const groupMap = ref<Record<string, any>>({}); // 用于快速查找
 let tableData = reactive<
-  { dept: { unitId: string | number; unitName: string }; users: PersonVO[] }[]
+  { dept: { deptId: string | number; deptName: string }; users: PersonVO[] }[]
 >([]); //存放考勤组人员列表数据
 const columns = [
  {
@@ -75,20 +75,41 @@ const columns = [
    dataIndex: ['dept', 'unitName'],
    key: 'dept',
    width: 120,
-    customRender: ({ record }: { record: any }) => record.dept.unitName,
+    customRender: ({
+      record,
+    }: {
+      record: {
+        dept: { deptId: string | number; deptName: string };
+        users: PersonVO[];
+      };
+    }) => record.dept.deptName,
  },
  {
    title: '已选人数',
    dataIndex: 'users',
    key: 'userCount',
    width: 100,
-    customRender: ({ record }: { record: any }) => record.users.length,
+    customRender: ({
+      record,
+    }: {
+      record: {
+        dept: { deptId: string | number; deptName: string };
+        users: PersonVO[];
+      };
+    }) => record.users.length,
  },
  {
    title: '人员',
    dataIndex: 'users',
    key: 'users',
-    customRender: ({ record }: { record: any }) =>
+    customRender: ({
+      record,
+    }: {
+      record: {
+        dept: { deptId: string | number; deptName: string };
+        users: PersonVO[];
+      };
+    }) =>
      record.users.map((user: any) =>
        h(
          Tag,
@@ -129,7 +150,12 @@ function handleRemoveRow(index: number) {
  tableData.splice(index, 1);
 }

-function handleTableData(newTableData: any) {
+function handleTableData(
+  newTableData: {
+    dept: { deptId: string | number; deptName: string };
+    users: PersonVO[];
+  }[],
+) {
  // 如果现有数据为空，直接替换
  if (tableData.length === 0) {
    tableData.splice(0, 0, ...newTableData);
@@ -145,7 +171,7 @@ function handleTableData(newTableData: any) {
  for (const newItem of newTableData) {
    // 查找是否已存在相同部门
    const existingDeptIndex = tableData.findIndex(
-      (item) => item.dept.unitId === newItem.dept.unitId,
+      (item) => item.dept.deptId === newItem.dept.deptId,
    );

    if (existingDeptIndex !== -1) {
@@ -154,7 +180,7 @@ function handleTableData(newTableData: any) {
      for (const newUser of newItem.users) {
        // 检查该用户是否已存在
        const userExists = existingDept?.users.some(
-          (existingUser) => existingUser.id === newUser.id,
+          (existingUser) => existingUser.userId === newUser.userId,
        );
        if (!userExists) {
          // 用户不存在，添加到现有部门
@@ -187,7 +213,9 @@ const [BasicModal, modalApi] = useVbenModal({
    modalApi.modalLoading(false);
  },
 });
-const totalSelected: number = 0;
+const totalSelected = computed(() =>
+  tableData.reduce((sum, row) => sum + (row.users?.length || 0), 0),
+);

 function handleAdd() {
  unitPersonmodalApi.setData({});
@@ -255,9 +283,9 @@ async function handleConfirm() {
    for (const item of tableData) {
      for (const user of item.users) {
        data.userGroupList.push({
-          deptId: item.dept.unitId, //部门ID
-          deptName: item.dept.unitName, //部门名称
-          employeeId: user.id, //员工ID
+          deptId: item.dept.deptId, //部门ID
+          deptName: item.dept.deptName, //部门名称
+          employeeId: user.userId, //员工ID
          employeeName: user.userName, //员工姓名
        });
      }
--- a/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/data.ts
+++ b/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/data.ts
@@ -106,7 +106,10 @@ export const columns: VxeGridProps['columns'] = [
    field: 'attendanceGroup.attendanceType',
    slots: {
      default: ({ row }) => {
-        return renderDict(String(row.attendanceGroup.attendanceType),'wy_kqlx')
+        return renderDict(
+          String(row.attendanceGroup.attendanceType),
+          'wy_kqlx',
+        );
      },
    },
    width: 'auto',
@@ -118,9 +121,12 @@ export const columns: VxeGridProps['columns'] = [
    slots: {
      default: ({ row }) => {
        if (row.attendanceShift.startTime && row.attendanceShift.endTime) {
-          if(row.attendanceShift.restEndTime&&row.attendanceShift.restStartTime){
+          if (
+            row.attendanceShift.restEndTime &&
+            row.attendanceShift.restStartTime
+          ) {
            return `${row.attendanceShift.startTime}～${row.attendanceShift.endTime} ${row.shift.restStartTime}～${row.shift.restEndTime}`;
-          }else{
+          } else {
            return `${row.attendanceShift.startTime}～${row.attendanceShift.endTime}`;
          }
        }
@@ -193,12 +199,12 @@ export const unitColumns: VxeGridProps['columns'] = [
  },
  {
    title: '所属单位',
-    field: 'unitName',
+    field: 'deptName',
    width: 'auto',
  },
  {
    title: '电话',
-    field: 'phone',
+    field: 'phonenumber',
    minWidth: 120,
  },
 ];
@@ -266,7 +272,7 @@ export const modalSchema: FormSchemaGetter = () => [
 ];

 //排班日期详情
-export const workforceDayDetailColumns:VxeGridProps['columns'] =[
+export const workforceDayDetailColumns: VxeGridProps['columns'] = [
  {
    title: '序号',
    field: 'id',
@@ -287,16 +293,18 @@ export const workforceDayDetailColumns:VxeGridProps['columns'] =[
    field: 'attendanceGroup.attendanceType',
    slots: {
      default: ({ row }) => {
-        return renderDict(String(row.attendanceGroup.attendanceType),'wy_kqlx')
+        return renderDict(
+          String(row.attendanceGroup.attendanceType),
+          'wy_kqlx',
+        );
      },
    },
    width: 'auto',
-
  },
  {
    title: '班次名称',
    field: 'shift.name',
-    width:'auto' ,
+    width: 'auto',
  },
  {
    title: '考勤时间',
@@ -305,9 +313,9 @@ export const workforceDayDetailColumns:VxeGridProps['columns'] =[
    slots: {
      default: ({ row }) => {
        if (row.shift.startTime && row.shift.endTime) {
-          if(row.shift.restEndTime&&row.shift.restStartTime){
+          if (row.shift.restEndTime && row.shift.restStartTime) {
            return `${row.shift.startTime}～${row.shift.endTime} ${row.shift.restStartTime}～${row.shift.restEndTime}`;
-          }else{
+          } else {
            return `${row.shift.startTime}～${row.shift.endTime}`;
          }
        }
@@ -318,7 +326,7 @@ export const workforceDayDetailColumns:VxeGridProps['columns'] =[
  {
    title: '班组人数',
    field: 'userCount',
-    width:100,
+    width: 100,
    slots: { default: 'userCount' },
  },
  {
@@ -328,4 +336,4 @@ export const workforceDayDetailColumns:VxeGridProps['columns'] =[
    fixed: 'right',
    slots: { default: 'userGroupList' },
  },
-]
+];
--- a/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/dept-tree.vue
+++ b/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/dept-tree.vue
@@ -0,0 +1,122 @@
+<script setup lang="ts">
+import type { PropType } from 'vue';
+import type { DeptTree } from '#/api/system/user/model';
+import { onMounted, ref } from 'vue';
+import { SyncOutlined } from '@ant-design/icons-vue';
+import { Empty, InputSearch, Skeleton, Tree } from 'ant-design-vue';
+import { getDeptTree } from '#/api/system/user';
+
+defineOptions({ inheritAttrs: false });
+
+withDefaults(defineProps<{ showSearch?: boolean }>(), { showSearch: true });
+
+const emit = defineEmits<{
+  /**
+   * 点击刷新按钮的事件
+   */
+  reload: [];
+  /**
+   * 点击节点的事件
+   */
+  select: [];
+}>();
+
+const selectDeptId = defineModel('selectDeptId', {
+  required: true,
+  type: Array as PropType<string[]>,
+});
+
+const searchValue = defineModel('searchValue', {
+  type: String,
+  default: '',
+});
+
+/** 部门数据源 */
+type DeptTreeArray = DeptTree[];
+const deptTreeArray = ref<DeptTreeArray>([]);
+/** 骨架屏加载 */
+const showTreeSkeleton = ref<boolean>(true);
+
+async function loadTree() {
+  showTreeSkeleton.value = true;
+  searchValue.value = '';
+  selectDeptId.value = [];
+  const ret = await getDeptTree();
+  deptTreeArray.value = ret;
+  showTreeSkeleton.value = false;
+}
+
+async function handleReload() {
+  await loadTree();
+  emit('reload');
+}
+
+onMounted(loadTree);
+</script>
+
+<template>
+  <div :class="$attrs.class">
+    <Skeleton
+      :loading="showTreeSkeleton"
+      :paragraph="{ rows: 8 }"
+      active
+      class="p-[8px]"
+    >
+      <div
+        class="bg-background flex h-full flex-col overflow-y-auto rounded-lg"
+      >
+        <!-- 固定在顶部 必须加上bg-background背景色 否则会产生'穿透'效果 -->
+        <div
+          v-if="showSearch"
+          class="bg-background z-100 sticky left-0 top-0 p-[8px]"
+        >
+          <InputSearch
+            v-model:value="searchValue"
+            :placeholder="$t('pages.common.search')"
+            size="small"
+          >
+            <template #enterButton>
+              <a-button @click="handleReload">
+                <SyncOutlined class="text-primary" />
+              </a-button>
+            </template>
+          </InputSearch>
+        </div>
+        <div class="h-full overflow-x-hidden px-[8px]">
+          <Tree
+            v-bind="$attrs"
+            v-if="deptTreeArray.length > 0"
+            v-model:selected-keys="selectDeptId"
+            :class="$attrs.class"
+            :field-names="{ title: 'label', key: 'id' }"
+            :show-line="{ showLeafIcon: false }"
+            :tree-data="deptTreeArray"
+            :virtual="false"
+            default-expand-all
+            @select="$emit('select')"
+          >
+            <template #title="{ label }">
+              <span v-if="label.indexOf(searchValue) > -1">
+                {{ label.substring(0, label.indexOf(searchValue)) }}
+                <span style="color: #f50">{{ searchValue }}</span>
+                {{
+                  label.substring(
+                    label.indexOf(searchValue) + searchValue.length,
+                  )
+                }}
+              </span>
+              <span v-else>{{ label }}</span>
+            </template>
+          </Tree>
+          <!-- 仅本人数据权限 可以考虑直接不显示 -->
+          <div v-else class="mt-5">
+            <Empty
+              :image="Empty.PRESENTED_IMAGE_SIMPLE"
+              description="无部门数据"
+            />
+          </div>
+        </div>
+      </div>
+    </Skeleton>
+  </div>
+</template>
--- a/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/scheduleView.vue
+++ b/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/scheduleView.vue
@@ -114,6 +114,7 @@ async function handleDelete(row: Required<ArrangementForm>) {
            border: '1px solid #d9d9d9',
            borderRadius: '4px',
          }"
+          class="calendar"
        >
          <Calendar
            v-model:value="value"
@@ -158,7 +159,7 @@ async function handleDelete(row: Required<ArrangementForm>) {
  </div>
 </template>
 <style scoped>
-:deep(.ant-radio-group) {
+.calendar :deep(.ant-radio-group) {
  display: none;
 }
 </style>
--- a/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/type.d.ts
+++ b/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/type.d.ts
@@ -1,67 +1,52 @@
 //列表数据，用于展示人员列表
 export interface PersonVO {
-  /**
-   * 主键id
-   */
-  id: string | number;
-
-  /**
-   * 用户id
-   */
-  userId: string | number;
-
-  /**
-   * 用户名称
-   */
+  userId: string;
+  tenantId: string;
+  deptId: number;
  userName: string;
-
-  /**
-   * 联系电话
-   */
-  phone: string;
-
-  /**
-   * 性别
-   */
-  gender: number;
-
-  /**
-   * 人脸图片
-   */
-  img: string;
-
-  /**
-   * 所属单位id
-   */
-  unitId: string | number;
-
-  /**
-   * 所属单位名称
-   */
-  unitName: string;
-
-  /**
-   * 入驻位置
-   */
-  locathon: string;
-
-  /**
-   * 入驻时间
-   */
-  time: string;
-
-  /**
-   * 车牌号码
-   */
-  carNumber: string;
-
-  /**
-   * 状态
-   */
-  state: number | string;
-
-  /**
-   * 备注
-   */
+  nickName: string;
+  userType: string;
+  email: string;
+  phonenumber: string;
+  sex: string;
+  avatar?: string;
+  status: string;
+  loginIp: string;
+  loginDate: string;
  remark: string;
+  createTime: string;
+  dept: Dept;
+  roles: Role[];
+  roleIds?: string[];
+  postIds?: number[];
+  roleId: string;
+  deptName: string;
+}
+export interface Dept {
+  deptId: number;
+  parentId: number;
+  parentName?: string;
+  ancestors: string;
+  deptName: string;
+  orderNum: number;
+  leader: string;
+  phone?: string;
+  email?: string;
+  status: string;
+  createTime?: string;
+}
+
+export interface Role {
+  roleId: string;
+  roleName: string;
+  roleKey: string;
+  roleSort: number;
+  dataScope: string;
+  menuCheckStrictly?: boolean;
+  deptCheckStrictly?: boolean;
+  status: string;
+  remark: string;
+  createTime?: string;
+  flag: boolean;
+  superAdmin: boolean;
 }
--- a/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/unit-person-modal.vue
+++ b/apps/web-antd/src/views/property/attendanceManagement/workforceManagement/unit-person-modal.vue
@@ -1,35 +1,22 @@
 <script setup lang="ts">
-import { computed, ref, reactive, onMounted, watch } from 'vue';
-import { SyncOutlined } from '@ant-design/icons-vue';
-import {
-  Tree,
-  InputSearch,
-  Skeleton,
-  Empty,
-  Button,
-  Tag,
-} from 'ant-design-vue';
+import { computed, ref, reactive, watch } from 'vue';
+import { Tag } from 'ant-design-vue';

 import { $t } from '@vben/locales';
-import { cloneDeep } from '@vben/utils';

 import { useVbenForm } from '#/adapter/form';
-import {
-  arrangementAdd,
-  arrangementInfo,
-  arrangementUpdate,
-} from '#/api/property/attendanceManagement/arrangement';
+import { arrangementInfo } from '#/api/property/attendanceManagement/arrangement';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 import { useVbenVxeGrid, type VxeGridProps } from '#/adapter/vxe-table';
 import { modalSchema, unitColumns, unitQuerySchema } from './data';
-import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
-import { resident_unitList } from '#/api/property/resident/unit';
-import { personList } from '#/api/property/resident/person';
+import { useVbenModal, type VbenFormProps } from '@vben/common-ui';
+import { userList } from '#/api/system/user';
 import type { PersonVO } from './type';
+import DeptTree from './dept-tree.vue';
 const emit = defineEmits<{
  reload: [
    tableData: {
-      dept: { unitId: string | number; unitName: string };
+      dept: { deptId: string | number; deptName: string };
      users: PersonVO[];
    }[],
  ];
@@ -39,27 +26,8 @@ const isUpdate = ref(false);
 const title = computed(() => {
  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
 });
-const showSearch = ref(true);
-const searchValue = ref('');
 const selectedDeptIds = ref<string[]>([]);
 const showTreeSkeleton = ref(false);
-//单位树
-const deptTree = reactive<
-  {
-    id: string;
-    label: string;
-    children: {
-      id: string;
-      label: string;
-    }[];
-  }[]
->([
-  {
-    id: '',
-    label: '全部单位',
-    children: [],
-  },
-]);

 //勾选内容
 let selectedUsers = ref<PersonVO[]>([]);
@@ -67,34 +35,10 @@ let selectedUsers = ref<PersonVO[]>([]);

 let tableData = reactive<
  {
-    dept: { unitId: string | number; unitName: string };
+    dept: { deptId: string | number; deptName: string };
    users: PersonVO[];
  }[]
 >([]);
-function handleReload() {
-  showTreeSkeleton.value = true;
-  setTimeout(() => {
-    showTreeSkeleton.value = false;
-  }, 800);
-}
-
-const filteredDeptTree = computed(() => {
-  if (!searchValue.value) return deptTree;
-  // 递归过滤树
-  function filter(tree: any[]): any[] {
-    return tree
-      .map((node) => {
-        if (node.label.includes(searchValue.value)) return node;
-        if (node.children) {
-          const children = filter(node.children);
-          if (children.length) return { ...node, children };
-        }
-        return null;
-      })
-      .filter(Boolean);
-  }
-  return filter(deptTree);
-});

 const [BasicForm, formApi] = useVbenForm({
  commonConfig: {
@@ -159,6 +103,15 @@ const formOptions: VbenFormProps = {
  //    ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'],
  //  ],
  // ],
+  handleReset: async () => {
+    selectDeptId.value = [];
+
+    const { formApi, reload } = tableApi;
+    await formApi.resetForm();
+    const formValues = formApi.form.values;
+    formApi.setLatestSubmissionValues(formValues);
+    await reload(formValues);
+  },
 };
 const gridOptions: VxeGridProps = {
  checkboxConfig: {
@@ -178,11 +131,17 @@ const gridOptions: VxeGridProps = {
  pagerConfig: {},
  proxyConfig: {
    ajax: {
-      query: async ({ page }) => {
-        return await personList({
+      query: async ({ page }, formValues = {}) => {
+        // 部门树选择处理
+        if (selectDeptId.value.length === 1) {
+          formValues.deptId = selectDeptId.value[0];
+        } else {
+          Reflect.deleteProperty(formValues, 'deptId');
+        }
+        return await userList({
          pageNum: page.currentPage,
          pageSize: page.pageSize,
-          unitId: selectedDeptIds.value[0],
+          ...formValues,
        });
      },
    },
@@ -222,13 +181,13 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
 async function handleConfirm() {
  try {
    for (const user of selectedUsers.value) {
-      if (tableData.find((item) => item.dept.unitId === user.unitId)) {
+      if (tableData.find((item) => item.dept.deptId === user.deptId)) {
        tableData
-          .find((item) => item.dept.unitId === user.unitId)!
+          .find((item) => item.dept.deptId === user.deptId)!
          .users.push(user);
      } else {
        tableData.push({
-          dept: { unitId: user.unitId, unitName: user.unitName },
+          dept: { deptId: user.deptId, deptName: user.deptName },
          users: [user],
        });
      }
@@ -237,7 +196,7 @@ async function handleConfirm() {
    resetInitialized();
    emit('reload', tableData);
    tableData = [];
-    selectedUsers.value =[];
+    selectedUsers.value = [];
    modalApi.close();
  } catch (error) {
    console.error(error);
@@ -250,19 +209,6 @@ async function handleClosed() {
  await formApi.resetForm();
  resetInitialized();
 }
-
-async function getUnitList() {
-  deptTree[0]!.children = [];
-  const res = await resident_unitList();
-  if (deptTree[0] && Array.isArray(deptTree[0].children)) {
-    for (const item of res.rows) {
-      deptTree[0].children.push({
-        id: item.id as string,
-        label: item.name as string,
-      });
-    }
-  }
-}
 // 查询对应部门人员列表
 async function fetchDeptUsers() {
  tableApi.query();
@@ -272,85 +218,35 @@ watch(selectedDeptIds, (newVal) => {
    fetchDeptUsers();
  }
 });
-onMounted(() => {
-  getUnitList();
-});
 </script>

 <template>
  <BasicModal :title="title">
-    <div class="mb-2 flex">
-      <div>
-        <Skeleton
-          :loading="showTreeSkeleton"
-          :paragraph="{ rows: 8 }"
-          active
-          class="p-[8px]"
-        >
+    <Page :auto-content-height="true">
+      <div class="flex h-full gap-[8px]">
+        <DeptTree
+          v-model:select-dept-id="selectDeptId"
+          class="w-[200px]"
+          @reload="() => tableApi.reload()"
+          @select="() => tableApi.reload()"
+        />
+        <div class="flex-1 overflow-hidden">
          <div
-            class="bg-background z-100 sticky left-0 top-0 flex items-center p-[8px]"
+            class="mb-2 flex overflow-auto"
+            style="max-height: 80px; font-size: 14px"
          >
-            <InputSearch
-              v-model:value="searchValue"
-              placeholder="搜索单位"
-              size="small"
-              style="flex: 1"
+            已选人员：
+            <span
+              v-for="user in selectedUsers"
+              :key="user.userId"
+              style="margin-right: 8px"
            >
-              <template #enterButton>
-                <Button type="text" @click="getUnitList">
-                  <SyncOutlined class="text-primary" />
-                </Button>
-              </template>
-            </InputSearch>
+              <Tag>{{ user.userName }}</Tag>
+            </span>
          </div>
-          <div class="h-full overflow-x-hidden px-[8px]">
-            <Tree
-              v-if="filteredDeptTree.length > 0"
-              v-model:selectedKeys="selectedDeptIds"
-              :field-names="{ title: 'label', key: 'id' }"
-              :show-line="{ showLeafIcon: false }"
-              :tree-data="filteredDeptTree"
-              :virtual="false"
-              default-expand-all
-            >
-              <template #title="{ label }">
-                <span v-if="searchValue && label.indexOf(searchValue) > -1">
-                  {{ label.substring(0, label.indexOf(searchValue)) }}
-                  <span style="color: #f50">{{ searchValue }}</span>
-                  {{
-                    label.substring(
-                      label.indexOf(searchValue) + searchValue.length,
-                    )
-                  }}
-                </span>
-                <span v-else>{{ label }}</span>
-              </template>
-            </Tree>
-            <div v-else class="mt-5">
-              <Empty
-                :image="Empty.PRESENTED_IMAGE_SIMPLE"
-                description="无单位数据"
-              />
-            </div>
-          </div>
-        </Skeleton>
-      </div>
-      <div class="flex-1">
-        <div
-          class="mb-2 flex overflow-auto"
-          style="max-height: 80px; font-size: 14px"
-        >
-          已选人员：
-          <span
-            v-for="user in selectedUsers"
-            :key="user.id"
-            style="margin-right: 8px"
-          >
-            <Tag>{{ user.userName }}</Tag>
-          </span>
+          <BasicTable> </BasicTable>
        </div>
-        <BasicTable> </BasicTable>
      </div>
-    </div>
+    </Page>
  </BasicModal>
 </template>