zant-admin 1.0.0

package/src/views/login.vue

@@ -0,0 +1,272 @@
+<template>
+  <div class="app">
+    <div class="demo-login">
+      <div class="tel flex-row">
+        <img src="@/assets/imgs/logo.png" alt="" width="50px" />ZAntAdmin
+      </div>
+      <a-tabs v-model:activeKey="activeKey" centered tabBarGutter="10">
+        <a-tab-pane key="1" tab="密码登录">
+          <a-form
+            :model="formState"
+            name="normal_login"
+            class="login-form"
+            @finish="onFinish"
+            @finishFailed="onFinishFailed"
+          >
+            <a-form-item
+              name="mobile"
+              :rules="[{ required: true, message: '手机号码不能为空!' }]"
+            >
+              <a-input
+                v-model:value="formState.mobile"
+                placeholder="请输入手机号码"
+                size="large"
+              >
+                <template #prefix>
+                  <MobileOutlined class="site-form-item-icon" />
+                </template>
+              </a-input>
+            </a-form-item>
+            <a-form-item
+              name="password"
+              :rules="[{ required: true, message: '密码不能为空!' }]"
+            >
+              <a-input-password
+                v-model:value="formState.password"
+                placeholder="请输入密码"
+                size="large"
+              >
+                <template #prefix>
+                  <LockOutlined class="site-form-item-icon" />
+                </template>
+              </a-input-password>
+            </a-form-item>
+            <a-form-item>
+              <a-form-item name="remember" no-style>
+                <a-checkbox v-model:checked="formState.remember"
+                  >自动登录</a-checkbox
+                >
+              </a-form-item>
+              <a class="login-form-forgot" href="">忘记密码</a>
+            </a-form-item>
+
+            <a-form-item>
+              <a-button
+                :disabled="disabled"
+                type="primary"
+                :loading="loading"
+                html-type="submit"
+                size="large"
+                class="login-form-button"
+              >
+                登录
+              </a-button>
+            </a-form-item>
+          </a-form>
+        </a-tab-pane>
+        <a-tab-pane key="2" tab="验证码登录" force-render>
+          <a-form
+            :model="formState"
+            name="normal_login"
+            class="login-form"
+            @finish="onFinish"
+            @finishFailed="onFinishFailed"
+          >
+            <a-form-item
+              name="mobile"
+              :rules="[{ required: true, message: '手机号码不能为空!' }]"
+            >
+              <a-input
+                v-model:value="formState.mobile"
+                placeholder="请输入手机号码"
+                size="large"
+              >
+                <template #prefix>
+                  <MobileOutlined class="site-form-item-icon" />
+                </template>
+              </a-input>
+            </a-form-item>
+            <a-row :gutter="16">
+              <a-col :span="16">
+                <a-form-item
+                  name="mobile"
+                  :rules="[{ required: true, message: '验证码不能为空!' }]"
+                >
+                  <a-input
+                    v-model:value="formState.vercode"
+                    placeholder="请输入验证码"
+                    size="large"
+                  >
+                    <template #prefix>
+                      <LockOutlined class="site-form-item-icon" />
+                    </template>
+                  </a-input>
+                </a-form-item>
+              </a-col>
+              <a-col :span="8">
+                <a-button
+                  size="large"
+                  class="login-form-button"
+                  @click="sendSmsCode"
+                  :disabled="smsdisabled"
+                >
+                  {{ smstext }}
+                </a-button>
+              </a-col>
+            </a-row>
+            <a-form-item>
+              <a-form-item name="remember" no-style>
+                <a-checkbox v-model:checked="formState.remember"
+                  >自动登录</a-checkbox
+                >
+              </a-form-item>
+              <a class="login-form-forgot" href="">忘记密码</a>
+            </a-form-item>
+            <a-form-item>
+              <a-button
+                :disabled="disabled"
+                type="primary"
+                :loading="loading"
+                html-type="submit"
+                size="large"
+                class="login-form-button"
+              >
+                登录
+              </a-button>
+            </a-form-item>
+          </a-form>
+        </a-tab-pane>
+      </a-tabs>
+    </div>
+    <div class="footer">Copyright © 2025 *********</div>
+  </div>
+</template>
+<script setup>
+import { login } from '@/api/methods/login'
+import sysUser from '@/api/methods/sysUser'
+import router, { refreshRoutes } from '@/router'
+import { useUserStore } from '@/stores/user'
+import { reactive, computed, ref } from 'vue'
+import { message } from 'ant-design-vue'
+const formState = reactive({
+  mobile: '123456',
+  password: '123456',
+  remember: true,
+  vercode: '',
+})
+const loading = ref(false)
+const user = useUserStore()
+const activeKey = ref('1')
+//登录
+const onFinish = values => {
+  loading.value = true
+
+  let data = {
+    mobile: values.mobile,
+    password: values.password,
+    loginType: 0,
+    vercode: '',
+  }
+  login(data)
+    .then(async res => {
+      loading.value = false
+      user.token = res.data.token
+      user.userInfo = res.data
+      message.success('登录成功')
+         // 重置路由状态并重新加载动态路由
+      try {
+        await refreshRoutes()
+        router.push('/console')
+      } catch (error) {
+        console.error('路由加载失败:', error)
+        // 即使路由加载失败，也跳转到控制台，路由守卫会处理后续逻辑
+        router.push('/console')
+      }
+    })
+    .catch(err => {
+      loading.value = false
+    })
+}
+const disabled = computed(() => {
+  console.log(activeKey.value)
+  if (activeKey.value == '1') {
+    return !(formState.mobile && formState.password)
+  } else {
+    return !(formState.mobile && formState.vercode)
+  }
+})
+const smstext = ref('获取验证码')
+const smsdisabled = ref(false)
+let countdownTimer
+//发送验证码
+const sendSmsCode = () => {
+  if (formState.mobile == '') {
+    message.error('请输入手机号码')
+    return
+  }
+  sysUser.sendCode({ mobile: formState.mobile }).then(res => {
+    message.success('验证码已发送')
+    smsdisabled.value = true
+    smstext.value = '60s后可重发'
+    let count = 60
+    countdownTimer = setInterval(() => {
+      count--
+      smstext.value = `${count}s后可重发`
+      if (count === 0) {
+        clearInterval(countdownTimer)
+        smsdisabled.value = false
+        smstext.value = '获取验证码'
+      }
+    }, 1000)
+  })
+}
+</script>
+<style scoped>
+.app {
+  height: 100vh !important;
+  display: flex !important;
+  align-items: center !important;
+  background-image: url(../assets/imgs/loginbackground.svg);
+  background-size: 100% 100%;
+}
+
+.demo-login {
+  width: 400px !important;
+  height: auto;
+  margin: 0 auto;
+  background-color: rgba(255, 255, 255, 1);
+  padding: 30px;
+  border-radius: 20px;
+}
+
+.demo-auto-login {
+  margin-bottom: 60px;
+  text-align: left;
+}
+
+.demo-auto-login a {
+  float: right;
+}
+
+.tel {
+  font-size: 30px;
+  text-align: center;
+  padding: 20px;
+  color: rgb(0, 0, 0);
+}
+
+.login-form-forgot {
+  float: right;
+}
+
+.login-form-button {
+  width: 100%;
+}
+.footer {
+  position: fixed;
+  bottom: 20px;
+  left: 0;
+  right: 0;
+  text-align: center;
+}
+</style>

package/src/views/operations/log/logError.vue

@@ -0,0 +1,78 @@
+<template>
+  <form-table
+    :formState="formState"
+    :columns="columns"
+    modulePath="LogError"
+    :rowSelect="false"
+    :permissionModulePath="permissionModulePath"
+    @details="details"
+  >
+  </form-table>
+  <!-- 详情 -->
+  <LogErrorDetails
+    :open="detailsopen"
+    :info="info"
+    @close="detailsopen = false"
+  >
+  </LogErrorDetails>
+</template>
+<script setup>
+import { ref } from 'vue'
+import FormTable from '@/components/FormTable.vue'
+import logError from '@/api/methods/logError'
+import LogErrorDetails from '@/components/details/logErrorDetails.vue'
+// 权限模块路径
+const permissionModulePath = ref('operations:log:logError')
+const formState = ref({
+  actionName: { label: '方法', value: '', type: 'text' },
+  code: { label: '异常码', value: '', type: 'text' },
+  createTime: { label: '日期范围', value: '', type: 'time' },
+})
+const columns = ref([
+  {
+    title: '序号',
+    key: 'num',
+    width: 80,
+  },
+  {
+    title: '方法',
+    dataIndex: 'actionName',
+    ellipsis: true,
+  },
+  {
+    title: '异常码',
+    dataIndex: 'code',
+    width: 100,
+  },
+  {
+    title: '异常内容',
+    dataIndex: 'message',
+    ellipsis: true,
+  },
+
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    width: 200,
+  },
+  {
+    title: '操作',
+    key: 'operation',
+    fixed: 'right',
+    width: 100,
+  },
+])
+//详情
+const detailsopen = ref(false)
+const info = ref({})
+const details = record => {
+  logError.detail({ id: record.id }).then(res => {
+    info.value = res.data
+    detailsopen.value = true
+  })
+}
+const detailsHandleCancel = () => {
+  detailsopen.value = false
+}
+</script>
+<style></style>

package/src/views/operations/log/logLogin.vue

@@ -0,0 +1,66 @@
+<template>
+  <form-table
+    :formState="formState"
+    :columns="columns"
+    modulePath="LogLogin"
+    :rowSelect="false"
+  >
+    <!-- 可以通过插槽自定义单元格 -->
+    <template #custom-status="{ record }">
+      <span
+        v-html="dictTemplate.tabletempbool('loginlog_status', record.status)"
+      ></span>
+    </template>
+  </form-table>
+</template>
+<script setup>
+import { ref } from 'vue'
+import FormTable from '@/components/FormTable.vue'
+import dictTemplate from '@/utils/dictTemplate'
+const formState = ref({
+  userName: { label: '用户名称', value: '', type: 'text' },
+  createTime: { label: '日期范围', value: '', type: 'time' },
+})
+const columns = ref([
+  {
+    title: '序号',
+    key: 'num',
+    width: 80,
+  },
+  {
+    title: '用户名称',
+    dataIndex: 'userName',
+  },
+  {
+    title: '登录ip',
+    dataIndex: 'loginIp',
+  },
+  {
+    title: '登录地点',
+    dataIndex: 'loginLocation',
+  },
+  {
+    title: '浏览器',
+    dataIndex: 'browser',
+  },
+  {
+    title: '操作系统',
+    dataIndex: 'operatingSystem',
+  },
+  {
+    title: '状态',
+    key: 'status',
+  },
+  {
+    title: '备注',
+    dataIndex: 'remark',
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    width: 200,
+  },
+])
+</script>
+
+<style></style>

package/src/views/operations/log/logOperation.vue

@@ -0,0 +1,103 @@
+<template>
+  <form-table
+    :formState="formState"
+    :columns="columns"
+    modulePath="LogOperation"
+    :permissionModulePath="permissionModulePath"
+    :rowSelect="false"
+    @details="details"
+  >
+  </form-table>
+  <!-- 详情 -->
+  <LogOperationDetails
+    :open="detailsopen"
+    :info="info"
+    @close="detailsopen = false"
+  >
+  </LogOperationDetails>
+</template>
+<script setup>
+import { ref } from 'vue'
+import FormTable from '@/components/FormTable.vue'
+import LogOperationDetails from '@/components/details/logOperationDetails.vue'
+import logOperation from '@/api/methods/logOperation'
+// 权限模块路径
+const permissionModulePath = ref('operations:log:logOperation')
+const formState = ref({
+  controllerName: { label: '控制器名称', value: '', type: 'text' },
+  operationMethod: { label: '操作方法', value: '', type: 'text' },
+  operationPersonnel: { label: '操作人员', value: '', type: 'text' },
+  createTime: { label: '日期范围', value: '', type: 'time' },
+})
+const columns = ref([
+  {
+    title: '序号',
+    key: 'num',
+    width: 80,
+  },
+  {
+    title: '控制器名称',
+    dataIndex: 'controllerName',
+    width: 200,
+  },
+  {
+    title: '操作方法',
+    dataIndex: 'operationMethod',
+    width: 200,
+  },
+  {
+    title: '请求地址',
+    dataIndex: 'requestAddress',
+    ellipsis: true,
+  },
+  {
+    title: '请求方式',
+    dataIndex: 'requestMethod',
+    width: 100,
+  },
+  {
+    title: '请求Ip',
+    dataIndex: 'operationIp',
+    width: 120,
+  },
+  {
+    title: '请求端源',
+    dataIndex: 'requestFrom',
+    width: 100,
+  },
+  {
+    title: 'UserAgent',
+    dataIndex: 'userAgent',
+    ellipsis: true,
+  },
+  {
+    title: '操作人员',
+    dataIndex: 'operationPersonnel',
+    width: 100,
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    width: 200,
+  },
+  {
+    title: '操作',
+    key: 'operation',
+    fixed: 'right',
+    width: 100,
+  },
+])
+//详情
+const detailsopen = ref(false)
+const info = ref({})
+const details = record => {
+  logOperation.detail({ id: record.id }).then(res => {
+    info.value = res.data
+    detailsopen.value = true
+  })
+}
+const detailsHandleCancel = () => {
+  detailsopen.value = false
+}
+</script>
+<style></style>

package/src/views/operations/log/logQuartz.vue

@@ -0,0 +1,57 @@
+<template>
+  <form-table
+    :where="recordwhere"
+    :columns="columns"
+    modulePath="quartz"
+    pageAction="logPage"
+    :rowSelect="false"
+  >
+    <template #custom-status="{ record }">
+      <span class="text-color-success" v-if="record.status">成功</span>
+      <span class="text-color-error" v-else>失败</span>
+    </template>
+  </form-table>
+</template>
+<script setup>
+import { ref } from 'vue'
+import FormTable from '@/components/FormTable.vue'
+const props = defineProps({
+  recordwhere: {
+    type: Object,
+    default: {},
+  },
+})
+const columns = ref([
+  {
+    title: '序号',
+    key: 'num',
+    width: 60,
+  },
+  {
+    title: '开始时间',
+    dataIndex: 'beginDate',
+    width: 160,
+  },
+  {
+    title: '结束时间',
+    dataIndex: 'endDate',
+    width: 160,
+  },
+  {
+    title: '状态',
+    key: 'status',
+    width: 100,
+  },
+  {
+    title: '消息',
+    dataIndex: 'result',
+    width: 100,
+  },
+  {
+    title: '异常',
+    dataIndex: 'error',
+
+  },
+])
+</script>
+<style></style>