Merge remote-tracking branch 'origin/main'

policeManagement/src/components/layout/layout.vue

@@ -24,30 +24,25 @@
       </a-menu> -->
       <!-- 动态生成菜单项 -->
       <a-menu v-model:selectedKeys="selectedKeys" theme="light" mode="inline">
-        <template v-for="route in menuRoutes">
+        <template v-for="route in staticRouter">
-          <!--  -->
+          <a-menu-item v-if="route.meta?.title === undefined && route.children">
-          <a-menu-item v-if="route.name === 'dashboard'">
             <router-link :to="`${route.children[0].path}`">
-              <pie-chart-outlined />
+              <HomeOutlined v-if="route.name === 'dashboard'" />
-              <span>{{ route.meta?.title }}</span>
+              <InsuranceOutlined v-if="route.name === 'police'" />
+              <SoundOutlined v-if="route.name === 'law'" />
+              <ApartmentOutlined v-if="route.name === 'warning'" />
+              <span>{{ route?.children[0]?.meta?.title }}</span>
             </router-link>
           </a-menu-item>
-          <a-sub-menu v-if="route.children && route.children.length && route?.name !== 'dashboard'" :key="route.path">
+          <a-sub-menu v-if="route.children && route.children.length && route?.meta?.title" :key="route.path">
             <template #title>
-              <pie-chart-outlined />
+              <MailOutlined />
               <span>{{ route.meta?.title }}</span>
             </template>
             <a-menu-item v-for="child in route.children" :key="child.path">
-              <router-link :to="`${route.path}${child.path}`">{{ child.meta?.title }}</router-link>
+              <router-link :to="`${route.path}/${child.path}`">{{ child.meta?.title }}</router-link>
             </a-menu-item>
           </a-sub-menu>
-          <!--  -->
-          <a-menu-item v-if="!route.children">
-            <router-link :to="route.path">
-              <pie-chart-outlined />
-              <span>{{ route.meta?.title }}</span>
-            </router-link>
-          </a-menu-item>
         </template>
       </a-menu>
     </a-layout-sider>
@@ -56,10 +51,14 @@
         <layout-header v-model:collapsed="collapsed" />
       </a-layout-header>
       <a-layout-content class="layout-content">
-        <router-view v-slot="{ Component, route }">
+        <!-- <keep-alive> 会缓存已经访问过的组件，当你再次访问同一个页面时，它会直接从缓存中加载，而不会触发重新渲染 -->
+        <!-- router-view 必须绑定一个key 否则就会出现 路由切换白屏的问题（路由切换后，页面不显示内容，刷新后正常显示），但是这样也会导致一个问题就是 会导致keep-alive失效、因为这种方式会强制刷新路由-->
+
+        <router-view v-slot="{ Component, route }" :key="route.path">
+          <!-- <router-view v-slot="{ Component, route }"> -->
           <transition appear name="fade-transform" mode="out-in">
             <keep-alive :include="keepAliveNames">
-              <component :is="Component" :key="route.fullPath" />
+              <component :is="Component" :key="route.path" />
             </keep-alive>
           </transition>
         </router-view>
@@ -69,9 +68,9 @@
 </template>
 
 <script setup lang="ts">
+import { InsuranceOutlined, HomeOutlined, SoundOutlined, MailOutlined, ApartmentOutlined, InboxOutlined, AppstoreOutlined } from '@ant-design/icons-vue'
 import LayoutHeader from '@/components/layout/header/LayoutHeader.vue'
 import { computed } from 'vue'
-// import Sliber from '@/components/layout/sliber/sliber.vue'
 import { staticRouter } from '@/router/staticRouters'
 import { useRoute } from 'vue-router'
 const route = useRoute()
@@ -81,7 +80,10 @@ const route = useRoute()
 
 const selectedKeys = computed(() => [route.path])
 // 过滤出需要在菜单中显示的路由
-const menuRoutes = computed(() => staticRouter.filter((route) => route.meta && route.meta.title))
+// const menuRoutes = computed(() => staticRouter.filter((route) => route.meta && route.meta.title))
+// staticRouter.forEach((element) => {
+//   console.log(element.meta?.title)
+// })
 
 // 示例：动态控制缓存页面的名称
 // const keepAliveNames = ref(['index'])
@@ -90,7 +92,8 @@ import { ref } from 'vue'
 // 控制菜单折叠
 const collapsed = ref<boolean>(false)
 
-const keepAliveNames = ref<string[]>([])
+// const keepAliveNames = ref<string[]>(['Index', 'Register'])
+const keepAliveNames = ref<string[]>(['index', 'rindex'])
 </script>
 
 <style scoped lang="scss">

policeManagement/src/components/login/TelephoneLogin.vue

@@ -15,7 +15,7 @@
 
 <script lang="ts" setup>
 import { ref } from 'vue'
-import { FormInstance, message, notification } from 'ant-design-vue'
+import { FormInstance, notification } from 'ant-design-vue'
 import { Rule } from 'ant-design-vue/es/form'
 import { LoginParams } from '@/types/views/login.ts'
 import api from '@/axios'
@@ -24,7 +24,10 @@ import rsaUtil from '@/utils/rsaUtil.ts'
 import { TokenInfo } from '@/types/stores/userStore.ts'
 import { useUserStore } from '@/stores/modules/userStore.ts'
 import { useRouter } from 'vue-router'
-
+const props = defineProps<{
+  account: string
+  password: string
+}>()
 const userStore = useUserStore()
 const router = useRouter()
 
@@ -47,9 +50,11 @@ const loginParamsRule: Record<keyof LoginParams, Rule[]> = {
   ],
 }
 const loginParams = ref<LoginParams>({
-  accountOrTelephone: __APP_ENV.VITE_APP_ENV === 'development' ? 'ERwuf2' : '',
+  accountOrTelephone: __APP_ENV.VITE_APP_ENV === 'development' ? '' : '',
-  password: __APP_ENV.VITE_APP_ENV === 'development' ? '123456' : '',
+  password: __APP_ENV.VITE_APP_ENV === 'development' ? '' : '',
 })
+loginParams.value.accountOrTelephone = props.account
+loginParams.value.password = props.password
 
 /**
  * 登录

policeManagement/src/global.d.ts

@@ -8,3 +8,15 @@ interface JsonResult<T> {
     message: string;
     data?: T;
 }
+interface dataStatus {
+    account: string;
+    password: string;
+    remark: string;
+    checkStatus: {
+        extData: {
+            color: string;
+        };
+        label: string;
+        value: number;
+    };
+}

policeManagement/src/router/index.ts

@@ -27,22 +27,19 @@ router.beforeEach(async (to, from, next) => {
         return next(from.fullPath)
     }
     //判断访问路径是不是白名单d
-    console.log('访问路径', to.path);
+    // console.log('访问路径', to.path);
 
     if (ROUTER_WHITE_LIST.includes(to.path)) {
         return next();
     } else {
+        //不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录
         if (!userStore.getTokenInfo?.value) {
             await message.warn('未找到token，请重新登陆!')
             return next('/login');
         }
     }
-    //不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录
+
-    // if (!userStore.getTokenInfo?.value) {
+
-    //     await message.warn('未找到token，请重新登陆!')
-    //     return next('/login');
-    // }
-    //放行
     return next();
 })
 

policeManagement/src/router/staticRouters.ts

@@ -5,19 +5,10 @@ export const Layout = () => import("@/components/layout/layout.vue");
 export const staticRouter: RouteRecordRaw[] =
     [
         {
-            path: "/",
+            path: '/',
-            name: "/",
-            component: Layout,
-            redirect: "/dashboard",
-            children: []
-        },
-        {
-
-            path: '',
             name: 'dashboard',
             redirect: '/index',
             meta: {
-                title: '首页',
                 keepalive: true
             },
             component: Layout,
@@ -39,45 +30,111 @@ export const staticRouter: RouteRecordRaw[] =
 
         {
 
-            path: '',
+            path: '/query-',
-            name: 'register',
+            name: 'query-',
             meta: {
-                title: '注册',
+                title: '信息查询',
                 keepalive: true
             },
             component: Layout,
             children: [
                 {
-                    path: '/register',  // 这里使用相对路径而不是 '/register'
+                    path: 'public-unit',  // 这里使用相对路径而不是 '/register'
-                    name: '',
+                    name: 'public-unit',
                     meta: {
-                        title: '注册',
+
+                        title: '企事业单位',
                         keepalive: true
                     },
-                    component: () => import('@/views/register.vue')
+                    component: () => import('@/views/query/publicUnit.vue')
+                },
+                {
+                    path: 'weapp-user',  // 这里使用相对路径而不是 '/register'
+                    name: 'weapp-user',
+                    meta: {
+
+                        title: '微信小程序用户',
+                        keepalive: true
+                    },
+                    component: () => import('@/views/query/weappUser.vue')
                 },
             ]
         },
         {
-            //登录页面
             path: '/login',
             name: 'login',
             meta: {
-                // title: '登录',
+                keepalive: true
-                // keepalive: true
             },
             component: () => import('@/views/login.vue')
         },
         {
-            //登录页面
+
             path: '/register-index',
             name: 'register-index',
             meta: {
-                // title: '注册',
             },
             component: () => import('@/views/register.vue')
         },
 
+
+        {
+            path: '/law',
+            name: 'law',
+            meta: {
+
+            },
+            component: Layout,
+            children: [
+                {
+                    path: '/law-index',
+                    name: 'law-index',
+                    meta: {
+                        title: '法制宣传',
+                        keepalive: true
+                    },
+                    component: () => import('@/views/law/index.vue')
+                },
+            ]
+        },
+        {
+            path: '/police',
+            name: 'police',
+            meta: {
+
+            },
+            component: Layout,
+            children: [
+                {
+                    path: '/police-presence',
+                    name: 'police-presence',
+                    meta: {
+                        title: '警保风采',
+                        keepalive: true
+                    },
+                    component: () => import('@/views/police/index.vue')
+                },
+            ]
+        },
+        {
+            path: '/warning',
+            name: 'warning',
+            meta: {
+
+            },
+            component: Layout,
+            children: [
+                {
+                    path: '/early-warning',
+                    name: 'early-warning',
+                    meta: {
+                        title: '三色预警',
+                        keepalive: true
+                    },
+                    component: () => import('@/views/warning/index.vue')
+                },
+            ]
+        },
     ]
 
 

policeManagement/src/stores/modules/userStore.ts

@@ -1,5 +1,5 @@
-import {defineStore} from "pinia";
+import { defineStore } from "pinia";
-import {TokenInfo, UserStore} from "@/types/stores/userStore.ts";
+import { TokenInfo, UserStore } from "@/types/stores/userStore.ts";
 
 export const useUserStore = defineStore({
     id: 'useUserStore',
@@ -19,6 +19,10 @@ export const useUserStore = defineStore({
     getters: {
         getTokenInfo: (state): TokenInfo => state.tokenInfo as TokenInfo,
     },
+
+    // persist 是 Pinia 的一个插件 pinia-plugin-persistedstate 提供的功能
+    // 用来让状态数据在页面刷新或重新加载时保存在浏览器的存储中
+    // 通过这个插件，你可以让 Pinia store 的状态持久化，即即使页面刷新，数据也不会丢失
     persist: {
         key: "useUserStore",
         storage: window.localStorage,

policeManagement/src/views/dashboard/index.vue

@@ -1,6 +1,10 @@
 <template><div>111111</div></template>
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+defineOptions({
+  name: 'Index',
+})
+</script>
 
 <style scoped lang="scss"></style>
 <!-- <template>

policeManagement/src/views/law/index.vue

@@ -0,0 +1,9 @@
+<template>
+    <div>
+      <!-- 法制宣传 -->
+      法制宣传
+    </div>
+  </template>
+  
+  <script setup lang="ts"></script>
+  

policeManagement/src/views/login.vue

@@ -10,7 +10,7 @@
         <div class="title">欢迎来到超级后台</div>
         <a-tabs class="account-tab" v-model:active-key="activeKey">
           <a-tab-pane :key="0" tab="账号登录">
-            <TelephoneLogin />
+            <TelephoneLogin :account="account" :password="password" />
           </a-tab-pane>
         </a-tabs>
         <div class="oauth">
@@ -38,8 +38,15 @@
 import { QqOutlined, WechatOutlined } from '@ant-design/icons-vue'
 import TelephoneLogin from '@/components/login/TelephoneLogin.vue'
 import { ref } from 'vue'
-
+import { useRoute } from 'vue-router'
+const route = useRoute()
+const account = ref<string>('')
+const password = ref<string>('')
 const activeKey = ref(0)
+account.value = route.query.account as string
+password.value = route.query.password as string
+// console.log('Account:', account.value)
+// console.log('Password:', password.value)
 </script>
 
 <style lang="scss" scoped>

policeManagement/src/views/police/index.vue

@@ -0,0 +1,8 @@
+<template>
+  <div>
+    <!-- 警保风采 -->
+    警保风采
+  </div>
+</template>
+
+<script setup lang="ts"></script>

policeManagement/src/views/query/publicUnit.vue

@@ -0,0 +1,8 @@
+<template>
+  <div>
+    <!-- 企事业单位 -->
+    企事业单位
+  </div>
+</template>
+
+<script setup lang="ts"></script>

policeManagement/src/views/query/weappUser.vue

@@ -0,0 +1,8 @@
+<template>
+  <div>
+    <!-- 微信小程序用户 -->
+    微信小程序用户
+  </div>
+</template>
+
+<script setup lang="ts"></script>

policeManagement/src/views/register.vue

@@ -32,21 +32,21 @@
                   </a-form-item>
                 </div>
                 <!-- 用户根据单位代码去查询 审核状态 -->
-                <a-form-item has-feedback label="单位代码" name="code">
+                <a-form-item has-feedback label="单位机构代码" name="code">
                   <a-input v-model:value="formState.code" autocomplete="off" />
                 </a-form-item>
-                <a-form-item has-feedback label="单位名称" name="name">
+                <a-form-item has-feedback label="单位机构名称" name="name">
                   <a-input v-model:value="formState.name" autocomplete="off" />
                 </a-form-item>
 
                 <a-form-item has-feedback label="详细地址" name="address">
                   <a-input v-model:value="formState.address" autocomplete="off" />
                 </a-form-item>
-                <a-form-item has-feedback label="联系人姓名" name="contactPersonInfo">
+                <a-form-item has-feedback label="联系人姓名" name="contactName">
-                  <a-input v-model:value="formState.contactPersonInfo.name" autocomplete="off" />
+                  <a-input v-model:value="formState.contactName" autocomplete="off" />
                 </a-form-item>
-                <a-form-item has-feedback label="联系人电话" name="contactPersonInfo">
+                <a-form-item has-feedback label="联系人电话" name="telephone">
-                  <a-input v-model:value="formState.contactPersonInfo.telephone" autocomplete="off" />
+                  <a-input v-model:value="formState.telephone" autocomplete="off" />
                 </a-form-item>
                 <!--  -->
 
@@ -60,13 +60,14 @@
           </a-tab-pane>
           <a-tab-pane key="2" tab="查询注册结果">
             <div class="flex items-center justify-center flex-col" style="max-height: 500px; overflow-y: auto">
-              <a-card v-if="isLogin" class="mb-8" style="width: 300px">
+              <a-form :label-col="labelCol" :wrapper-col="wrapperCol" :model="statusDate" layout="horizontal">
-                <div>账户：{{ account }}</div>
+                <a-form-item label="单位机构代码" name="onlyCode" :rules="[{ required: true, message: '请输入单位代码进行查询' }]">
-                <div>密码：{{ password }}</div>
+                  <a-input placeholder="请输入单位代码查询" :allowClear="true" v-model:value="statusDate.onlyCode"></a-input>
-              </a-card>
+                </a-form-item>
-              <a-input v-if="isHasAccount" class="w-40 mb-8" v-model:value="searchCode.code" autocomplete="off" placeholder="请输入单位代码查询" />
+                <a-form-item :wrapper-col="{ offset: 8, span: 16 }">
-              <a-button v-if="isHasAccount" size="large" type="primary" :loading="loading" @click="getCheckStatus"> 查询审核状态 </a-button>
+                  <a-button type="primary" html-type="submit" style="width: 100px" @click="getCheckStatus">确认</a-button>
-              <a-button v-if="isLogin" size="large" type="primary" @click="toLogin"> 去登录 </a-button>
+                </a-form-item>
+              </a-form>
             </div>
           </a-tab-pane>
         </a-tabs>
@@ -78,21 +79,25 @@
 <script setup lang="ts">
 import { useRouter } from 'vue-router'
 const router = useRouter()
-
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
-import { message } from 'ant-design-vue'
+import { message, Modal } from 'ant-design-vue'
-// import type { CascaderProps } from 'ant-design-vue';
 import api from '@/axios/index.ts'
 import type { ShowSearchType } from 'ant-design-vue/es/cascader'
-import { onMounted, reactive, ref } from 'vue'
+import { onMounted, reactive, ref, defineComponent, createVNode, h } from 'vue'
+defineComponent({
+  name: 'Register',
+})
 onMounted(() => {
   getTree()
 })
+const labelCol = { style: { width: '120px' } }
+const wrapperCol = { span: 14 }
 const filter: ShowSearchType['filter'] = (inputValue, path) => {
   return path.some((option) => option.title.toLowerCase().indexOf(inputValue.toLowerCase()) > -1)
 }
 const value = ref<string[]>([])
 const options = ref<any[]>([])
-const cascaderChange = (value: any, selectedOptions: any): void => {
+const cascaderChange = (value: any): void => {
   formState.administrativeDivisionCodes = [...value]
 }
 
@@ -151,7 +156,6 @@ const loadTreeFromCache = async (): Promise<any | null> => {
     const request = store.get('treeData')
 
     request.onsuccess = () => {
-      // console.log('🚀 ~ loadTreeFromCache ~ request.result:', request.result)
       if (request.result !== undefined) {
         resolve(request.result) // 返回缓存数据
       } else {
@@ -169,7 +173,6 @@ const loadTreeFromCache = async (): Promise<any | null> => {
 const getTree = async () => {
   // 先尝试从缓存中加载数据
   const cachedData = await loadTreeFromCache()
-  // console.log('🚀 ~ getTree ~ cachedData:', cachedData)
   if (cachedData) {
     console.log('未发请求')
     // 如果缓存存在，直接使用缓存数据
@@ -190,66 +193,83 @@ interface FormState {
   name: string
   code: number | string
   administrativeDivisionCodes: any[]
-
   address: string
-  contactPersonInfo: ContactPersonInfo
+  telephone: string //联系人手机
+  contactName: string //联系人姓名
 }
 const formRef = ref<FormInstance>()
-interface ContactPersonInfo {
-  telephone: string
-  name: string
-}
 const formState = reactive<FormState>({
   name: '',
   code: '',
   administrativeDivisionCodes: [],
-  // province: '',
-  // city: '',
-  // districts: '',
-  // street: '',
   address: '',
-  contactPersonInfo: {
   telephone: '',
-    name: '',
+  contactName: '',
-  },
 })
 
-const checkIsNull = async (_rule: Rule, value: string) => {
+const checkName = async (_rule: Rule, value: string) => {
   if (value === '') {
-    return Promise.reject('请输入')
+    return Promise.reject('请输入单位机构名称')
   } else {
     return Promise.resolve()
   }
 }
-const checkOBJ = async (_rule: Rule, value: ContactPersonInfo) => {
+const checkCode = async (_rule: Rule, value: string) => {
-  // console.log('🚀 ~ checkOBJ ~ value:', value)
+  if (value === '') {
-
+    return Promise.reject('请输入单位机构代码')
-  if (value.telephone !== '' && value.name !== '') {
-    return Promise.resolve()
   } else {
-    // return Promise.reject('请填写完整的联系人信息')
+    return Promise.resolve()
-    // return Promise.reject('请输入')
   }
 }
-
+const checkAddress = async (_rule: Rule, value: string) => {
+  if (value === '') {
+    return Promise.reject('请输入详细地址')
+  } else {
+    return Promise.resolve()
+  }
+}
+const checkTelephone = async (_rule: Rule, value: string) => {
+  if (value === '') {
+    return Promise.reject('请输入联系人电话')
+  } else {
+    return Promise.resolve()
+  }
+}
+const checkContactName = async (_rule: Rule, value: string) => {
+  if (value === '') {
+    return Promise.reject('请输入联系人姓名')
+  } else {
+    return Promise.resolve()
+  }
+}
+// 写自定义 Rule 是为之后修改做准备
 const rules: Record<string, Rule[]> = {
-  name: [{ required: true, validator: checkIsNull, trigger: 'change' }],
+  name: [{ required: true, validator: checkName, trigger: 'change' }],
-  code: [{ required: true, validator: checkIsNull, trigger: 'change' }],
+  code: [{ required: true, validator: checkCode, trigger: 'change' }],
-  address: [{ required: true, validator: checkIsNull, trigger: 'change' }],
+  address: [{ required: true, validator: checkAddress, trigger: 'change' }],
-
+  telephone: [{ required: true, validator: checkTelephone, trigger: 'change' }],
-  contactPersonInfo: [{ required: true, validator: checkOBJ, trigger: 'change' }],
+  contactName: [{ required: true, validator: checkContactName, trigger: 'change' }],
 }
 const layout = {
   labelCol: { span: 4 },
   wrapperCol: { span: 14 },
 }
 
-const register = (values: any) => {
+const register = () => {
   if (value.value.length === 0) {
     message.error('请选择行政区划')
     return
   } else {
-    api.post<any>('/common/policeUnitRegister', { ...formState }).then((res) => {
+    const { telephone, contactName, ...rest } = formState
+    const contactPersonInfo = {
+      telephone,
+      name: contactName,
+    }
+    const submitForm = {
+      ...rest,
+      contactPersonInfo,
+    }
+    api.post<any>('/common/policeUnitRegister', { ...submitForm }).then((res) => {
       console.log(res)
       if (res.code === 200) {
         message.success('提交成功')
@@ -259,14 +279,15 @@ const register = (values: any) => {
 }
 
 const handleFinish = (values: FormState) => {
-  console.log(values, formState)
+  console.log('自定义校验成功')
-  register(values)
+  console.log(values)
+  register()
 }
 const handleFinishFailed = (errors: any) => {
   console.log(errors)
 }
 const resetForm = () => {
-  formRef.value.resetFields()
+  formRef.value?.resetFields()
   value.value = []
 }
 const handleValidate = (...args: any[]) => {
@@ -275,35 +296,55 @@ const handleValidate = (...args: any[]) => {
 
 const activeKey = ref('1')
 const loading = ref<boolean>(false)
-const account = ref<string>('')
-const password = ref<string>('')
-const isHasAccount = ref<boolean>(true)
-const isLogin = ref<boolean>(false)
-// const searchCode = ref<string>()
-//
-const searchCode = reactive({
-  code: __APP_ENV.VITE_APP_ENV === 'development' ? 'dawda' : '',
-})
 
-const getCheckStatus = () => {
+const getCheckStatus = async () => {
+  if (statusDate.onlyCode.trim() === '') {
+    return
+  }
   loading.value = true
   api
-    .post<any>('/management/getCheckStatus', { onlyCode: searchCode.code, unitOptType: 'POLICE_UNIT' })
+    .post<dataStatus>('/management/getCheckStatus', statusDate)
     .then((res) => {
-      console.log('🚀 ~ api.post<any> ~ res:', res)
+      showConfirm(res.data as dataStatus)
-      if (res.code === 200) {
-        loading.value = false
-        isHasAccount.value = false
-        isLogin.value = true
-        account.value = res.data.account
-        password.value = res.data.password
-      }
     })
     .finally(() => {
       loading.value = false
     })
 }
-const toLogin = () => {
+import { useUserStore } from '@/stores/modules/userStore.ts'
-  router.replace({ path: '/login' })
+const showConfirm = (columnsDate: dataStatus) => {
+  if (columnsDate.checkStatus.value === 0) {
+    Modal.success({
+      title: `审核通过`,
+      icon: createVNode(ExclamationCircleOutlined),
+      content: h('div', {}, [h('div', `账号：${columnsDate.account}`), h('div', `密码：${columnsDate.password}`), h('div', `${columnsDate.remark}`)]),
+      okText: '跳转',
+      async onOk() {
+        await useUserStore().resetUserInfo()
+        await router
+          .replace({
+            path: '/login',
+            query: {
+              account: columnsDate.account,
+              password: columnsDate.password,
+            },
+          })
+          .then(() => {})
+      },
+      onCancel() {},
+    })
+  } else {
+    Modal.error({
+      title: `未审核`,
+      icon: createVNode(ExclamationCircleOutlined),
+      content: `${columnsDate.remark}`,
+    })
+  }
 }
+
+const statusDate = reactive({
+  // __APP_ENV.VITE_APP_ENV === 'development' ? 'dawda' : '',
+  onlyCode: '',
+  unitOptType: 'POLICE_UNIT',
+})
 </script>

policeManagement/src/views/warning/index.vue

@@ -0,0 +1,8 @@
+<template>
+  <div>
+    <!-- 三色预警 -->
+    三色预警
+  </div>
+</template>
+
+<script setup lang="ts"></script>

securityManagement/package.json

@@ -16,6 +16,7 @@
     "lodash-es": "^4.17.21",
     "pinia": "^2.2.2",
     "pinia-plugin-persistedstate": "^3.2.0",
+    "vue-component-type-helpers": "^2.1.2",
     "sass": "^1.77.8",
     "vue": "^3.4.37",
     "vue-router": "4",

securityManagement/src/assets/scss/myAntD.scss

@@ -0,0 +1,162 @@
+/* 扩展ant design pro按钮组件颜色 */
+$--my-antd-important: !important;
+
+.btn-danger {
+  color: #ffffff;
+  background-color: #F5222D;
+  border-color: #F5222D;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #ff4d4f $--my-antd-important;
+    border-color: #ff4d4f $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #cf1322 $--my-antd-important;
+    border-color: #cf1322 $--my-antd-important;
+  }
+}
+
+.btn-volcano {
+  color: #ffffff;
+  background-color: #FA541C;
+  border-color: #FA541C;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #ff7a45 $--my-antd-important;
+    border-color: #ff7a45 $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #d4380d $--my-antd-important;
+    border-color: #d4380d $--my-antd-important;
+  }
+}
+
+.btn-warn {
+  color: #ffffff;
+  background-color: #FAAD14;
+  border-color: #FAAD14;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #ffc53d $--my-antd-important;
+    border-color: #ffc53d $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #d48806 $--my-antd-important;
+    border-color: #d48806 $--my-antd-important;
+  }
+}
+
+.btn-success {
+  color: #ffffff;
+  background-color: #52C41A;
+  border-color: #52C41A;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #73d13d $--my-antd-important;
+    border-color: #73d13d $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #389e0d $--my-antd-important;
+    border-color: #389e0d $--my-antd-important;
+  }
+}
+
+.button-color-cyan {
+  color: #ffffff;
+  background-color: #13C2C2;
+  border-color: #13C2C2;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #36cfc9 $--my-antd-important;
+    border-color: #36cfc9 $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #08979c $--my-antd-important;
+    border-color: #08979c $--my-antd-important;
+  }
+}
+
+.btn-daybreak {
+  color: #ffffff;
+  background-color: #1890FF;
+  border-color: #1890FF;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #096dd9 $--my-antd-important;
+    border-color: #096dd9 $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #40a9ff $--my-antd-important;
+    border-color: #40a9ff $--my-antd-important;
+  }
+}
+
+.button-color-geekblue {
+  color: #ffffff;
+  background-color: #2F54EB;
+  border-color: #2F54EB;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #1d39c4 $--my-antd-important;
+    border-color: #1d39c4 $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #597ef7 $--my-antd-important;
+    border-color: #597ef7 $--my-antd-important;
+  }
+}
+
+.btn-purple {
+  color: #ffffff;
+  background-color: #722ED1;
+  border-color: #722ED1;
+
+  &:hover, &:focus {
+    color: #ffffff $--my-antd-important;
+    background-color: #9254de $--my-antd-important;
+    border-color: #9254de $--my-antd-important;
+  }
+
+  &:active, &.active {
+    color: #ffffff $--my-antd-important;
+    background-color: #531dab $--my-antd-important;
+    border-color: #531dab $--my-antd-important;
+  }
+}
+
+.table-row-warn td {
+  background-color: #fefca6;
+}
+
+.table-row-danger td {
+  background-color: #f79988;
+}
+
+.table-row-success td {
+  background-color: #b6fcbe;
+}
+
+.ant-table-summary td {
+  background: #edeff6;
+}

securityManagement/src/components/form/FormProMax.vue

@@ -0,0 +1,206 @@
+<template>
+  <a-form
+      ref="formProMaxRef"
+      v-bind="props"
+      :model="modelValue"
+  >
+    <a-row :gutter="props.gutter">
+      <a-col
+          v-for="(item,field) in props.formItemOptions as FormProMaxItemOptions<T>"
+          :key="field"
+          v-bind="getResponsive(item)"
+      >
+        <a-form-item
+            :name="field"
+            v-bind="item"
+            :label="undefined"
+        >
+          <template v-slot:label>
+            {{ item.label }}
+            <template v-if="item.remarkRender">
+              <a-popover :title="item.label" :content="item.remarkRender()">
+                <QuestionCircleOutlined class="margin-left-xs" style="color: red"/>
+              </a-popover>
+            </template>
+          </template>
+          <!--     自定义组件     -->
+          <!--     ant design vue 组件      -->
+          <a-input
+              v-if="item.type==='input'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <a-input-password
+              v-else-if="item.type==='inputPassword'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <a-input-number
+              v-else-if="item.type==='inputNumber'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+          />
+          <a-textarea
+              v-else-if="item.type==='inputTextArea'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <a-radio-group
+              v-else-if="item.type==='radioGroup'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :options="item.options"
+          />
+          <a-checkbox-group
+              v-else-if="item.type==='checkboxGroup'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :options="item.options"
+          />
+          <a-select
+              v-else-if="item.type==='select'"
+              v-model:value="modelValue[field]"
+              style="width: 100%"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+              :options="item.options"
+          />
+          <a-tree-select
+              v-else-if="item.type==='treeSelect'"
+              style="width: 100%"
+              v-model:value="modelValue[field]"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+              :tree-data="item.options"
+          />
+          <a-cascader
+              v-else-if="item.type ==='cascader'"
+              style="width: 100%"
+              v-model:value="modelValue[field]"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+              :options="item.options"
+          />
+          <a-range-picker
+              v-else-if="item.type ==='rangePicker'"
+              style="width: 100%"
+              v-model:value="modelValue[field]"
+              v-bind="item.componentsProps"
+              :placeholder="item.componentsProps?.placeholder ?? ['开始日期', '结束日期']"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <a-date-picker
+              v-else-if="item.type ==='datePicker'"
+              style="width: 100%"
+              v-model:value="modelValue[field]"
+              v-bind="item.componentsProps"
+              :placeholder="item.componentsProps?.placeholder ?? '请选择日期'"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <a-time-range-picker
+              v-else-if="item.type ==='timeRangePicker'"
+              style="width: 100%"
+              v-model:value="modelValue[field]"
+              v-bind="item.componentsProps"
+              :placeholder="item.componentsProps?.placeholder ?? ['开始时间', '结束时间']"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <a-time-picker
+              v-else-if="item.type ==='timePicker'"
+              style="width: 100%"
+              v-model:value="modelValue[field]"
+              v-bind="item.componentsProps"
+              :placeholder="getPlaceholder(item)"
+              :allowClear="item.componentsProps?.allowClear ?? true"
+          />
+          <template v-else-if="item.type==='custom'">
+            <component :is="item.customRender"/>
+          </template>
+        </a-form-item>
+      </a-col>
+    </a-row>
+    <slot name="formOperation"></slot>
+  </a-form>
+</template>
+
+<script setup lang="ts" generic="T extends Record<string,any>">
+import {FormInstance} from "ant-design-vue";
+import {ref} from "vue";
+import {FormExpose} from "ant-design-vue/es/form/Form";
+import {QuestionCircleOutlined} from '@ant-design/icons-vue'
+import {FormProMaxItemOptions, FormProMaxItemProps, FormProMaxProps} from "@/types/components/form/index.ts";
+
+
+const modelValue = defineModel<T>('value', {
+  default: {}
+})
+
+const props = withDefaults(defineProps<FormProMaxProps<T>>(), {
+  grid: () => {
+    return {
+      span: 24
+    }
+  },
+  gutter: 10,
+  labelCol: () => {
+    return {
+      style: {
+        width: '100px'
+      }
+    }
+  },
+  wrapperCol: () => {
+    return {
+      span: 18
+    }
+  },
+  labelAlign: "left",
+  colon: undefined,
+  disabled: undefined,
+  hideRequiredMark: undefined,
+  labelWrap: undefined,
+  scrollToFirstError: undefined,
+  validateOnRuleChange: undefined
+})
+
+const formProMaxRef = ref<FormInstance>(null!)
+
+const getResponsive = (item: FormProMaxItemProps): Grid => {
+  //span优先级高于响应式设置
+  if (item.grid) return item.grid.span ? {span: item.grid.span} : {...item.grid};
+  return {...props.grid}
+}
+
+//优先级: 组件本身=》formItem=》label
+const getPlaceholder = (item: FormProMaxItemProps) => item.componentsProps?.placeholder ?? item.placeholder ?? (item.type.includes('input') ? `请输入${item.label}` : `请选择${item.label}`)
+
+defineExpose<FormExpose>({
+  validate: (nameList, options) => formProMaxRef.value?.validate(nameList, options),
+  resetFields: (name) => formProMaxRef.value?.resetFields(name),
+  clearValidate: () => formProMaxRef.value?.clearValidate(),
+  getFieldsValue: (nameList) => formProMaxRef.value?.getFieldsValue(nameList),
+  scrollToField: (name, options) => formProMaxRef.value?.scrollToField(name, options),
+  validateFields: (nameList, options) => formProMaxRef.value?.validateFields(nameList, options)
+})
+
+</script>
+
+<style scoped>
+
+</style>

securityManagement/src/components/table/TableProMax.vue

@@ -0,0 +1,223 @@
+<template>
+  <div class="table-pro-content">
+    <div class="card padding" v-if="props.searchFormOptions">
+      <FormProMax
+          ref="searchFormRef"
+          :form-item-options="props.searchFormOptions"
+          v-model:value="searchParams"
+          v-bind="props.searchFormProps"
+      >
+        <template v-slot:formOperation>
+          <a-space class="margin-right flex-end">
+            <a-button type="primary" @click="search">
+              <search-outlined/>
+              搜索
+            </a-button>
+            <a-button danger @click="resetFormAndTable">
+              <rollback-outlined/>
+              重置
+            </a-button>
+          </a-space>
+        </template>
+      </FormProMax>
+    </div>
+    <div class="card padding margin-top-xs">
+      <div class="flex-justify-between">
+        <slot name="tableHeader" :selectKeys="selectKeys" :selectRows="selectRows"></slot>
+        <div></div>
+        <slot name="tableHeaderRight" :selectKeys="selectKeys" :selectRows="selectRows"></slot>
+        <a-space>
+          <template v-if="!props.searchFormOptions">
+            <a-tooltip>
+              <template #title>刷新数据</template>
+              <a-button shape="circle" @click="requestGetTableData">
+                <ReloadOutlined/>
+              </a-button>
+            </a-tooltip>
+          </template>
+          <template v-if="props.isPrinter">
+            <a-tooltip>
+              <template #title>打印数据</template>
+              <a-button shape="circle">
+                <PrinterOutlined/>
+              </a-button>
+            </a-tooltip>
+          </template>
+        </a-space>
+      </div>
+      <a-table
+          class="margin-top"
+          v-bind="props"
+          :columns="tableColumns"
+          :row-selection="props.isSelection ? props.selectionProps ? props.selectionProps : defaultSelectProps : null"
+          :data-source="dataSource"
+          :loading="loading"
+          :pagination="false"
+      >
+        <template v-for="(_,key) in slots" v-slot:[key]="scope">
+          <slot v-if="!includes(['tableHeader','tableHeaderRight'],key)" :name="key" v-bind="scope"></slot>
+        </template>
+      </a-table>
+      <a-pagination
+          v-if="props.isPagination"
+          class="flex-end margin-top margin-right"
+          v-model:current="pageParams.current"
+          v-model:page-size="pageParams.size"
+          :total="pageParams.total"
+          v-bind="props.paginationProps"
+          @change="handleCurrentChange"
+          @showSizeChange="handleSizeChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script
+    setup
+    lang="ts"
+    generic="T extends BaseTableRowRecord = {},P extends { [key: string]: any } ={}"
+>
+import FormProMax from "@/components/form/FormProMax.vue";
+import {PrinterOutlined, ReloadOutlined, RollbackOutlined, SearchOutlined} from "@ant-design/icons-vue";
+import {computed, onMounted, Ref, ref} from "vue";
+import {FormInstance} from "ant-design-vue";
+import useTableProMax from "@/hooks/useTableProMax";
+import {includes, isEmpty} from "lodash-es";
+import {BaseTableRowRecord, TableProMaxProps, TableProMaxRowSelect, TableProMaxSlots} from "@/types/components/table";
+
+const selectKeys = ref<string[]>([])
+const selectRows = ref<T[]>([]) as Ref<T[]>
+
+const defaultSelectProps: TableProMaxRowSelect<T> = {
+  type: "checkbox",
+  selectedRowKeys: selectKeys as any,
+  preserveSelectedRowKeys: true,
+  onSelect: (record, selected) => {
+    if (selected) {
+      selectKeys.value.push(record[props.rowKey] as string)
+      selectRows.value.push(record)
+    } else {
+      selectKeys.value.splice(selectKeys.value.findIndex(x => x === record[props.rowKey]));
+      selectRows.value.splice(selectRows.value.findIndex(r => r[props.rowKey] === record[props.rowKey]))
+    }
+  },
+  onChange: (selectedRowKeys, selectedRows) => {
+    selectKeys.value = selectedRowKeys as string[];
+    selectRows.value = selectedRows;
+  },
+}
+
+const clearSelect = () => {
+  selectKeys.value = [];
+  selectRows.value = [];
+}
+
+const props = withDefaults(defineProps<TableProMaxProps<T, P>>(), {
+  needIndex: true,
+  searchFormProps: () => {
+    return {
+      grid: {
+        xs: 24,
+        sm: 12,
+        md: 8,
+        lg: 6,
+        xl: 4
+      },
+      labelCol: undefined,
+      wrapperCol: undefined
+    }
+  },
+  rowKey: 'snowFlakeId',
+  requestAuto: true,
+  isPagination: true,
+  isSelection: false,
+  paginationProps: () => {
+    return {
+      showTotal: (total) => `共 ${total} 条`,
+      showSizeChanger: true,
+    }
+  },
+  bordered: true,
+  showSorterTooltip: undefined,
+  showHeader: undefined,
+  expandFixed: undefined,
+  expandRowByClick: undefined,
+  defaultExpandAllRows: undefined,
+  showExpandColumn: undefined,
+  sticky: undefined
+})
+const slots = defineSlots<TableProMaxSlots<T>>()
+
+const tableColumns = computed(() => {
+  let cols = props.columns;
+  if (!isEmpty(cols) && props.needIndex) {
+    if (!(cols?.[0].dataIndex === 'index')) {
+      cols?.unshift({
+        dataIndex: 'index',
+        width: 60,
+        title: '序号',
+        customRender: ({index}) => index + 1
+      })
+    }
+  }
+  return cols;
+})
+
+/**
+ * 表单实例
+ */
+const searchFormRef = ref<FormInstance>() as Ref<FormInstance>
+/**
+ * 查询参数
+ */
+const searchParams = ref<P | Record<string, any>>(props.defaultSearchParams || {}) as Ref<P>
+
+const {
+  loading,
+  dataSource,
+  pageParams,
+  search,
+  requestGetTableData,
+  handleSizeChange,
+  handleCurrentChange,
+  resetState
+} = useTableProMax(props.requestApi,
+    searchFormRef,
+    searchParams,
+    props.isPagination,
+    props.dataCallback,
+    props.requestError
+)
+
+onMounted(() => props.requestAuto && requestGetTableData(true))
+
+/**
+ * 重置表单并查询
+ */
+const resetFormAndTable = () => {
+  searchFormRef.value?.resetFields()
+  requestGetTableData()
+}
+
+defineExpose({
+  selectKeys,
+  selectRows,
+  requestGetTableData,
+  clearSelect,
+  resetTable: () => {
+    searchFormRef.value?.resetFields()
+    resetState();
+  }
+})
+
+</script>
+
+<style scoped lang="scss">
+.card {
+  box-sizing: border-box;
+  background-color: #ffffff;
+  border: 1px solid #e4e7ed;
+  border-radius: 6px;
+  box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
+}
+</style>

securityManagement/src/config/dict.ts

@@ -13,5 +13,5 @@ export const initEnums = () => {
     })
 }
 
-export const enumSelectNodes = <T>(enumType: DictType): SelectNodeVo<T>[] => JSON.parse(sessionStorage.getItem('dictMap') as string)?.[enumType] || []
+export const dictSelectNodes = <T>(enumType: DictType): SelectNodeVo<T>[] => JSON.parse(sessionStorage.getItem('dictMap') as string)?.[enumType] || []
 

securityManagement/src/config/index.ts

@@ -12,13 +12,13 @@ export const SYSTEM_MENUS: SystemMenu[] = [
         type: "menu",
         component: () => import('@/views/index.vue')
     }, {
-        title: '单位管理',
+        title: '用户管理',
         name: 'userManagement',
         path: '/userManagement',
         type: 'dir',
         children: [
             {
-                title: '用户管理',
+                title: '后台管理',
                 name: 'bgManagement',
                 path: '/bgManagement',
                 type: 'menu',

securityManagement/src/hooks/useTableProMax.ts

@@ -0,0 +1,134 @@
+import {ref, Ref} from "vue";
+import {Page, PageParams, PageResult} from "@/types/hooks/useTableProMax.ts";
+import {FormInstance} from "ant-design-vue";
+import {BaseTableRowRecord, RequestApiType} from "@/types/components/table";
+
+/**
+ *
+ * @param api 查询方法
+ * @param searchFormRef 表单校验
+ * @param searchParams 查询的参数
+ * @param isPageTable 是否分页
+ * @param dataCallBack 查询到数据后的回调
+ * @param requestError 查询出错回调
+ */
+export default <T extends BaseTableRowRecord, P extends Record<string, any> | PageParams<P>>(api: RequestApiType<T, P>,
+                                                                                             searchFormRef: Ref<FormInstance>,
+                                                                                             searchParams: Ref<P>,
+                                                                                             isPageTable: boolean = true,
+                                                                                             dataCallBack?: (data: T[]) => T[],
+                                                                                             requestError?: (errorMsg: any) => void) => {
+
+    const dataSource = ref<T[]>([]) as Ref<T[]>;
+    const loading = ref<boolean>(false);
+    const pageParams = ref<Page>({
+        current: 1,
+        size: 10,
+        total: 0
+    })
+
+    /**
+     * 获取表格数据
+     */
+    const requestGetTableData = async (isInit: boolean = false) => {
+        try {
+            //校验表单
+            !isInit && await searchFormRef.value?.validate();
+            //组装参数
+            let totalSearchParams;
+            if (isPageTable) {
+                totalSearchParams = {
+                    params: searchParams.value,
+                    page: {
+                        current: pageParams.value.current,
+                        size: pageParams.value.size
+                    }
+                } as PageParams<P>;
+            } else {
+                totalSearchParams = searchParams.value
+            }
+
+            loading.value = true;
+
+            const resp = await api(totalSearchParams as P);
+            let tableData: T[];
+
+            if (isPageTable) {
+                const {current, records, size, total} = resp.data as PageResult<T>;
+                isPageTable && updatePageParams({
+                    current: parseInt(current),
+                    size: parseInt(size),
+                    total: parseInt(total)
+                });
+                tableData = records;
+            } else {
+                tableData = resp.data as T[]
+            }
+            dataCallBack && (tableData = dataCallBack(tableData));
+            dataSource.value = tableData;
+        } catch (error) {
+            requestError && requestError(error);
+        } finally {
+            loading.value = false;
+        }
+    }
+
+    /**
+     * 更新分页信息
+     */
+    const updatePageParams = (ps: Page) => Object.assign(pageParams.value, ps)
+
+    /**
+     * 重置表格状态 包括 dataSource loading pageParams
+     */
+    const resetState = () => {
+        dataSource.value = [];
+        loading.value = false;
+        pageParams.value = {
+            current: 1,
+            size: 10,
+            total: 0
+        }
+    }
+
+    /**
+     * 表格数据查询 与 requestGetTableData 区别是会将页面重置为1
+     * 如果只做刷新数据请用 requestGetTableData
+     */
+    const search = async () => {
+        pageParams.value.current = 1;
+        await requestGetTableData();
+    };
+
+    /**
+     * @description 每页条数改变
+     * @param _
+     * @param {Number} size 页显示数量
+     */
+    const handleSizeChange = async (_: number, size: number) => {
+        pageParams.value.current = 1;
+        pageParams.value.size = size;
+        await requestGetTableData();
+    };
+
+    /**
+     * @description 当前页改变
+     * @param current 当前页
+     */
+    const handleCurrentChange = async (current: number) => {
+        pageParams.value.current = current;
+        await requestGetTableData();
+    };
+
+    return {
+        dataSource,
+        loading,
+        pageParams,
+        requestGetTableData,
+        search,
+        handleSizeChange,
+        handleCurrentChange,
+        resetState
+    };
+
+}

securityManagement/src/main.ts

@@ -4,6 +4,7 @@ import '@/reset.css'
 import './index.css'
 // 公共样式
 import '@/assets/scss/common.scss'
+import '@/assets/scss/myAntD.scss'
 // iconfont css
 import "@/assets/iconfont/iconfont.css";
 // vue Router

securityManagement/src/router/index.ts

@@ -32,7 +32,7 @@ router.beforeEach(async (to, from, next) => {
     // 不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录
     if (!userStore.getTokenInfo?.value) {
         await message.warn('未找到token，请重新登陆!')
-        return next('/login');
+        return next('/enterprise');
     }
     //放行
     return next();

securityManagement/src/router/staticRouters.ts

@@ -51,4 +51,9 @@ export const staticRouter: RouteRecordRaw[] = [
         name: 'test',
         component: () => import("@/views/test.vue"),
     },
+    {
+        path: '/enterprise',
+        name: 'enterprise',
+        component: () => import("@/views/enterprise.vue"),
+    },
 ]

securityManagement/src/types/components/form/index.ts

@@ -0,0 +1,73 @@
+import {
+    FormProps,
+    RangePicker,
+    Input,
+    InputNumber,
+    Textarea,
+    InputPassword,
+    RadioGroup,
+    Select,
+    TreeSelect,
+    Cascader,
+    CheckboxGroup,
+    DatePicker,
+    FormItem, TimeRangePicker, TimePicker,
+} from "ant-design-vue";
+import {Ref, UnwrapRef, VNode} from "vue";
+import {ComponentProps} from "vue-component-type-helpers";
+
+type FormProMaxItemType =
+    | 'custom'
+    | 'input'
+    | 'inputPassword'
+    | 'inputNumber'
+    | 'inputTextArea'
+    | 'radioGroup'
+    | 'select'
+    | 'selectIcon'
+    | 'selectUser'
+    | 'treeSelect'
+    | 'cascader'
+    | 'checkboxGroup'
+    | 'datePicker'
+    | 'rangePicker'
+    | 'timeRangePicker'
+    | 'timePicker';
+
+interface FormProMaxItemCommonProps extends ComponentProps<typeof FormItem> {
+    label?: string,
+    grid?: Grid,
+    placeholder?: string,
+    remarkRender?: () => VNode | string,
+    customRender?: () => VNode;
+    options?: (SelectNodeVo<unknown> | TreeNodeVo<unknown>) [] | Ref<(SelectNodeVo<unknown> | TreeNodeVo<unknown>)[]>
+}
+
+export interface FormProMaxItemProps<T extends FormProMaxItemType = any, C = any> extends FormProMaxItemCommonProps {
+    type: T
+    componentsProps?: C
+}
+
+export type FormProMaxItemOptions<T> = {
+    [key in keyof T | string]:
+    FormProMaxItemProps<'custom', ComponentProps<Record<string, any>>>
+    | FormProMaxItemProps<'input', ComponentProps<typeof Input>>
+    | FormProMaxItemProps<'inputPassword', ComponentProps<typeof InputPassword>>
+    | FormProMaxItemProps<'inputNumber', ComponentProps<typeof InputNumber>>
+    | FormProMaxItemProps<'inputTextArea', ComponentProps<typeof Textarea>>
+    | FormProMaxItemProps<'radioGroup', ComponentProps<typeof RadioGroup>>
+    | FormProMaxItemProps<'select', ComponentProps<typeof Select>>
+    | FormProMaxItemProps<'treeSelect', ComponentProps<typeof TreeSelect>>
+    | FormProMaxItemProps<'cascader', ComponentProps<typeof Cascader>>
+    | FormProMaxItemProps<'checkboxGroup', ComponentProps<typeof CheckboxGroup>>
+    | FormProMaxItemProps<'datePicker', ComponentProps<typeof DatePicker>>
+    | FormProMaxItemProps<'rangePicker', ComponentProps<typeof RangePicker>>
+    | FormProMaxItemProps<'timeRangePicker', ComponentProps<typeof TimeRangePicker>>
+    | FormProMaxItemProps<'timePicker', ComponentProps<typeof TimePicker>>
+}
+
+export interface FormProMaxProps<T = {}> extends FormProps {
+    grid?: Grid
+    gutter?: number;
+    formItemOptions?: FormProMaxItemOptions<T> | Ref<FormProMaxItemOptions<T>> | UnwrapRef<FormProMaxItemOptions<T>>
+}

securityManagement/src/types/components/table/index.ts

@@ -0,0 +1,55 @@
+import {PaginationProps, Table, TableProps} from "ant-design-vue";
+import {TableRowSelection} from "ant-design-vue/lib/table/interface";
+import {Ref, UnwrapRef} from "vue";
+import {ColumnType} from "ant-design-vue/es/table/interface";
+import {ComponentSlots} from "vue-component-type-helpers";
+import {FormProMaxItemOptions, FormProMaxProps} from "@/types/components/form";
+import {PageParams, PageResult} from "@/types/hooks/useTableProMax.ts";
+
+
+export type TableProMaxColumnType<T extends BaseTableRowRecord> = Omit<ColumnType<T>, 'dataIndex'> & {
+    dataIndex: keyof T | string | string[] | number | number[];
+}
+
+
+export type TableProMaxProps<
+    T extends BaseTableRowRecord = {},
+    P extends { [key: string]: any } = {}
+> = Partial<Omit<TableProps<T>, "dataSource" | 'pagination' | 'loading' | 'rowKey' | 'columns'>> & {
+    rowKey?: keyof T,
+    columns?: TableProMaxColumnType<T>[],
+    searchFormProps?: Omit<FormProMaxProps<P>, 'formItems'>
+    searchFormOptions?: FormProMaxItemOptions<P> | Ref<FormProMaxItemOptions<P>> | UnwrapRef<FormProMaxItemOptions<P>>,
+    defaultSearchParams?: { [key in keyof P | string]: any };
+    requestAuto?: boolean,
+    requestApi: RequestApiType<T, P>,
+    requestError?: (errorMsg: any) => void,
+    dataCallback?: (data: T[]) => T[],
+    isPagination?: boolean,
+    paginationProps?: TableProMaxPaginationProps,
+    isSelection?: boolean,
+    selectionProps?: TableProMaxRowSelect<T>,
+    isPrinter?: boolean,
+    needIndex?: boolean
+}
+
+export type TableProMaxSlots<T> = ComponentSlots<typeof Table> & {
+    tableHeader: (scope: { selectKeys: string[], selectRows: T[] }) => any,
+    tableHeaderRight: (scope: { selectKeys: string[], selectRows: T[] }) => any,
+}
+
+export type RequestApiType<T extends BaseTableRowRecord, P extends {
+    [key: string]: any
+} = {}> = (params: P | PageParams<P>) => Promise<JsonResult<T[] | PageResult<T>>>;
+
+export type TableProMaxPaginationProps = Partial<Omit<PaginationProps, "current" | "pageSize" | "total">>;
+
+export type TableProMaxRowSelect<T extends BaseTableRowRecord> = TableRowSelection<T>;
+
+export interface BaseTableRowRecord {
+    snowFlakeId?: string;
+    createUserName?: string;
+    createTime?: Date | string;
+    updateUserName?: string;
+    updateTime?: Date | string
+}

securityManagement/src/types/hooks/useTableProMax.ts

@@ -0,0 +1,26 @@
+/**
+ * 分页对象
+ */
+export interface Page {
+    current: number,
+    size: number,
+    total: number
+}
+
+/**
+ * 分页参数
+ */
+export interface PageParams<T extends Record<string, any> = {}> {
+    params: T & { [key: string]: any },
+    page: Omit<Page, 'total'>
+}
+
+/**
+ * 分页结果
+ */
+export interface PageResult<T> {
+    current: string,
+    records: T[],
+    size: string,
+    total: string
+}

securityManagement/src/types/views/bgManagement.ts

@@ -0,0 +1,22 @@
+import {BaseTableRowRecord} from "@/types/components/table";
+
+export interface BgManagementPagerQueryParams extends BaseTableRowRecord{
+    /** 名称 **/
+    name?: string;
+    /** 社会编码 **/
+    socialCode?: string;
+    /** 行政区划编码 **/
+    administrativeDivisionCodes?: string[];
+    /** 是否启用 **/
+    isEnable?: number;
+    /** 审核状态 **/
+    checkStatus?: number;
+    /** 账号  **/
+    account?:string,
+    sex?:BaseEnum<number>,
+    telephone?:string,
+    createTime?:string,
+    snowFlakeId?:string,
+    remark?:string,
+}
+

securityManagement/src/views/test.vue

@@ -1,11 +1,264 @@
 <template>
+  <div>
+    <TableProMax
+        ref="tableRef"
+        :request-api="reqApi"
+        :columns="columns"
+        :searchFormOptions="searchFormOptions"
+        :scroll="{x}"
+    >
+      <template #tableHeader>
+        <a-space>
+          <a-button type="primary" @click="addUserManagement">新增用户</a-button>
+        </a-space>
+      </template>
+    </TableProMax>
+    <a-modal
+        v-model:open="visible"
+        :title="title"
+        @ok="submit"
+        @cancel="closeModal"
+    >
+      <FormProMax ref="formRef" v-model:value="formParams"  :form-item-options="formItemOptions"/>
+    </a-modal>
+  </div>
 
 </template>
 
-<script setup lang="ts">
+<script setup lang="tsx">
+import TableProMax from "@/components/table/TableProMax.vue";
+import {TableProMaxProps} from "@/types/components/table";
+import api from "@/axios";
+import {ref} from "vue";
+import {ComponentExposed} from "vue-component-type-helpers";
+import {dictSelectNodes} from "@/config/dict.ts";
+import {BgManagementPagerQueryParams} from "@/types/views/bgManagement.ts";
+import FormProMax from "@/components/form/FormProMax.vue";
+import {FormProMaxItemOptions} from "@/types/components/form";
+import {FormExpose} from "ant-design-vue/es/form/Form";
+import {message} from "ant-design-vue";
+import {} from '@/hooks/useTableProMax.ts'
 
+
+type TableProps = TableProMaxProps<BgManagementPagerQueryParams>
+
+const tableRef = ref<ComponentExposed<typeof TableProMax>>(null!)
+// table表格
+const reqApi: TableProps['requestApi'] = (params) => api.post('/managementSecurityUnitUser/pager', params)  //分页
+const columns: TableProps['columns'] = [
+  {
+    dataIndex: 'account',
+    title: '账号',
+    width: 100,
+    ellipsis: true
+  },
+  {
+    dataIndex: 'name',
+    title: '名称',
+    width: 200,
+    ellipsis: true
+  }, {
+    dataIndex: 'sex',
+    title: '性别',
+    customRender: ({text}) => <a-tag>{text?.label}</a-tag>,
+    width: 150
+  }, {
+    dataIndex: 'telephone',
+    title: '手机号码',
+    width: 150,
+    ellipsis: true
+  },
+  {
+    dataIndex: 'createTime',
+    title: '创建时间',
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    dataIndex: 'snowFlakeId',
+    title: '社区唯一编码',
+    width: 200,
+    ellipsis: true
+  }, {
+    dataIndex: 'remark',
+    title: '备注',
+    width: 200,
+    ellipsis: true
+  }, {
+    dataIndex: 'isEnable',
+    title: '是否启用',
+    customRender: ({text}) => <a-tag color={text?.extData?.color}>{text?.label}</a-tag>,
+    width: 150
+  }, {
+    dataIndex: 'opt',
+    title: '操作',
+    fixed: "right",
+    customRender({record}) {
+      return <a-space>
+        <a-button class={record.isEnable.value === 0 ? 'btn-danger' : 'btn-success'}  onClick={async () => {
+          const resp = await api.post('/management/disableOrEnable', {
+            unitId: record.snowFlakeId,
+            unitOptType: UNIT_TYPE.security
+          })
+          message.success(resp.message)
+          await tableRef.value?.requestGetTableData()
+        }}>
+          {record.isEnable.value === 0 ? '禁用' : '启用'}
+        </a-button>
+
+
+
+        <a-button>
+          删除
+        </a-button>
+        <a-button  onClick={async () => {
+              visible.value = true
+              title.value = "编辑用户"
+              formParams.value.snowFlakeId = record.snowFlakeId
+              formParams.value.name = record.name,
+              formParams.value.sex =  record.sex.value,
+              formParams.value. telephone = record.telephone,
+              formParams.value.isEnable = record.isEnable?.value,
+              formParams.value.remark = record.remark
+        }}>
+          编辑
+        </a-button>
+      </a-space>
+    }
+  },
+]
+const x: number = columns.reduce((a, b) => a + (b.width as number), 0)
+const searchFormOptions: TableProps["searchFormOptions"] = {
+  name: {
+    type: 'input',
+    label: '名称'
+  }, sex: {
+    type: 'select',
+    label: '性别',
+    options: [
+      {
+        value: null,
+        label: '全部'
+      }, ...dictSelectNodes('Sex')
+    ]
+  },
+  telephone: {
+    type: 'input',
+    label: '手机号'
+  },
+  isEnable: {
+    type: 'select',
+    label: '是否启用',
+    options: [
+      {
+        value: null,
+        label: '全部'
+      }, ...dictSelectNodes('IsEnable')
+    ]
+  }
+}
+
+
+const visible = ref(false)
+const title = ref('新增用户')
+const formRef  = ref<FormExpose>(null)
+const formParams = ref<{
+  snowFlakeId?: string,
+  name: string,
+  sex: number,
+  telephone: string,
+  isEnable: boolean,
+  remark?: string,
+}>({
+  name: '',
+  sex: null,
+  telephone: '',
+  isEnable: null,
+})
+
+interface FromItem {
+  snowFlakeId?: string,
+  name: string,
+  sex: number,
+  telephone: string,
+  isEnable: boolean,
+  remark?: string,
+}
+
+const formItemOptions = ref<FormProMaxItemOptions<FromItem>>({
+
+  name:{
+     type:'input',
+     label:'姓名',
+     required:true,
+  },
+  sex:{
+     type:'radioGroup',
+     label:'性别',
+     options: dictSelectNodes('Sex'),
+     required:true,
+  },
+  telephone:{
+    type:'input',
+    label:'手机号',
+    required:true,
+  },
+  isEnable:{
+    type:'radioGroup',
+    label:'启用状态',
+    options: dictSelectNodes('IsEnable'),
+    required:true,
+  },
+  remark:{
+    type:'inputTextArea',
+    label:'备注',
+  }
+})
+const submit = async () => {
+  await formRef.value.validate()
+  const snowFlakeId = ref('')
+   if(title.value === '新增用户'){
+     snowFlakeId.value = ''
+   }else{
+     snowFlakeId.value = formParams.value.snowFlakeId
+   }
+  const managementSecurityUnitUserSaveOrUpdateParams = {
+    snowFlakeId:snowFlakeId.value,
+    name:formParams.value.name,
+    sex:formParams.value.sex,
+    telephone:formParams.value.telephone,
+    isEnable:formParams.value.isEnable,
+    remark:formParams.value.remark
+  }
+  const resp =  await api.post('/managementSecurityUnitUser/saveOrUpdate',managementSecurityUnitUserSaveOrUpdateParams)
+  message.success(resp.message)
+  close()
+}
+const close = ()=>{
+  tableRef.value?.requestGetTableData()
+  visible.value = false
+  closeModal()
+}
+const closeModal = () => {
+  formParams.value = {
+    name:'',
+    sex:null,
+    telephone:'',
+    isEnable:null,
+    remark:''
+  }
+  visible.value = false
+  // formRef.value.
+  console.log('取消')
+}
+//Form
+const addUserManagement = () => {
+  visible.value = true
+  title.value = ''
+}
 </script>
 
+
 <style scoped lang="scss">
 
 </style>