Compare commits
2 Commits
8054b44e88
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
1abd7dbc45 | ||
|
|
472babe0ce |
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div :style="{ width: isMinuteData ? '750px' : '610px' }">
|
<div :style="{ width: isMinuteData ? '750px' : '620px' }">
|
||||||
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange" filterable>
|
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange" filterable>
|
||||||
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
|
|||||||
@@ -7,11 +7,19 @@ export const defaultAttribute: VxeTableProps = {
|
|||||||
stripe: true,
|
stripe: true,
|
||||||
size: 'small',
|
size: 'small',
|
||||||
columnConfig: { resizable: true, useKey: true },
|
columnConfig: { resizable: true, useKey: true },
|
||||||
rowConfig: { isCurrent: true, isHover: true, },
|
rowConfig: { isCurrent: true, isHover: true },
|
||||||
scrollX: { scrollToLeftOnChange: true },
|
scrollX: { scrollToLeftOnChange: true },
|
||||||
scrollY: { enabled: false },
|
scrollY: { enabled: false },
|
||||||
|
tooltipConfig: { maxHeight: 150 },
|
||||||
// 注意:全局不要默认开启 treeConfig,会与 stripe 冲突;树表在页面自行配置
|
// 注意:全局不要默认开启 treeConfig,会与 stripe 冲突;树表在页面自行配置
|
||||||
customConfig: { enabled: true, allowFixed: true, storage: false, showFooter: false, immediate: true ,mode:'default'},
|
customConfig: {
|
||||||
|
enabled: true,
|
||||||
|
allowFixed: true,
|
||||||
|
storage: false,
|
||||||
|
showFooter: false,
|
||||||
|
immediate: true,
|
||||||
|
mode: 'default'
|
||||||
|
},
|
||||||
showOverflow: 'tooltip',
|
showOverflow: 'tooltip',
|
||||||
showHeaderOverflow: false
|
showHeaderOverflow: false
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,7 +12,7 @@
|
|||||||
<el-form-item
|
<el-form-item
|
||||||
v-if="datePicker"
|
v-if="datePicker"
|
||||||
style="grid-column: span 2"
|
style="grid-column: span 2"
|
||||||
:style="{ maxWidth: isStatisticData == 1 ? '750px' : '610px' }"
|
:style="{ maxWidth: isStatisticData == 1 ? '750px' : '620px' }"
|
||||||
>
|
>
|
||||||
<template #label>
|
<template #label>
|
||||||
<el-checkbox v-if="showTimeAll" v-model="timeAll" label="统计时间" />
|
<el-checkbox v-if="showTimeAll" v-model="timeAll" label="统计时间" />
|
||||||
|
|||||||
@@ -2,10 +2,24 @@
|
|||||||
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title">
|
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title">
|
||||||
<el-form :model="form" class="form-two" label-width="auto" :rules="rules" ref="formRef">
|
<el-form :model="form" class="form-two" label-width="auto" :rules="rules" ref="formRef">
|
||||||
<el-form-item label="用户名" prop="name">
|
<el-form-item label="用户名" prop="name">
|
||||||
<el-input v-model="form.name" placeholder="请输入昵称" maxlength="16" show-word-limit @input="handleInput('name', $event)" :disabled="title !== '新增用户'"/>
|
<el-input
|
||||||
|
v-model="form.name"
|
||||||
|
placeholder="请输入昵称"
|
||||||
|
maxlength="16"
|
||||||
|
show-word-limit
|
||||||
|
@input="handleInput('name', $event)"
|
||||||
|
:disabled="title !== '新增用户'"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="登录名" prop="loginName" >
|
<el-form-item label="登录名" prop="loginName">
|
||||||
<el-input v-model="form.loginName" placeholder="请输入登录名" maxlength="16" show-word-limit @input="handleInput('loginName', $event)" :disabled="title !== '新增用户'"/>
|
<el-input
|
||||||
|
v-model="form.loginName"
|
||||||
|
placeholder="请输入登录名"
|
||||||
|
maxlength="16"
|
||||||
|
show-word-limit
|
||||||
|
@input="handleInput('loginName', $event)"
|
||||||
|
:disabled="title !== '新增用户'"
|
||||||
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="默认密码" prop="password" v-if="title === '新增用户'">
|
<el-form-item label="默认密码" prop="password" v-if="title === '新增用户'">
|
||||||
<el-input v-model="form.password" placeholder="请输入密码" disabled />
|
<el-input v-model="form.password" placeholder="请输入密码" disabled />
|
||||||
@@ -47,16 +61,30 @@
|
|||||||
<el-form-item label="手机号" prop="phone">
|
<el-form-item label="手机号" prop="phone">
|
||||||
<el-input v-model="form.phone" placeholder="请输入手机号" />
|
<el-input v-model="form.phone" placeholder="请输入手机号" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="邮箱" prop="email">
|
<el-form-item label="邮箱" prop="email">
|
||||||
<el-input v-model="form.email" placeholder="请输入描述" />
|
<el-input v-model="form.email" placeholder="请输入描述" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
<el-form-item label="身份证号" prop="idCardNum">
|
||||||
|
<el-input
|
||||||
|
:model-value="idCardDisplay"
|
||||||
|
clearable
|
||||||
|
maxlength="18"
|
||||||
|
show-word-limit
|
||||||
|
placeholder="请输入18位身份证号(选填)"
|
||||||
|
@update:model-value="handleIdCardInput"
|
||||||
|
@focus="idCardEditing = true"
|
||||||
|
@blur="onIdCardBlur"
|
||||||
|
@clear="form.idCardNum = ''"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
<el-form-item label="起始IP" prop="limitIpStart">
|
<el-form-item label="起始IP" prop="limitIpStart">
|
||||||
<el-input v-model="form.limitIpStart" placeholder="请输入描述" />
|
<el-input v-model="form.limitIpStart" placeholder="请输入描述" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="结束IP" prop="limitIpEnd">
|
<el-form-item label="结束IP" prop="limitIpEnd">
|
||||||
<el-input v-model="form.limitIpEnd" placeholder="请输入描述" />
|
<el-input v-model="form.limitIpEnd" placeholder="请输入描述" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="时间段" prop="limitTime" >
|
<el-form-item label="时间段" prop="limitTime">
|
||||||
<el-slider v-model="form.limitTime" range style="width: 80%" show-stops :max="24" />
|
<el-slider v-model="form.limitTime" range style="width: 80%" show-stops :max="24" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="短信通知" prop="smsNotice">
|
<el-form-item label="短信通知" prop="smsNotice">
|
||||||
@@ -96,10 +124,9 @@
|
|||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, inject } from 'vue'
|
import { ref, inject, reactive, computed } from 'vue'
|
||||||
import { reactive } from 'vue'
|
|
||||||
import TableStore from '@/utils/tableStore'
|
|
||||||
import { ElMessage, FormItemRule } from 'element-plus'
|
import { ElMessage, FormItemRule } from 'element-plus'
|
||||||
|
import TableStore from '@/utils/tableStore'
|
||||||
import { roleList } from '@/api/user-boot/role'
|
import { roleList } from '@/api/user-boot/role'
|
||||||
import { add, edit } from '@/api/user-boot/user'
|
import { add, edit } from '@/api/user-boot/user'
|
||||||
import { useAdminInfo } from '@/stores/adminInfo'
|
import { useAdminInfo } from '@/stores/adminInfo'
|
||||||
@@ -120,6 +147,7 @@ const form = reactive({
|
|||||||
casualUser: 1,
|
casualUser: 1,
|
||||||
loginName: '',
|
loginName: '',
|
||||||
phone: '',
|
phone: '',
|
||||||
|
idCardNum:'',
|
||||||
limitIpEnd: '',
|
limitIpEnd: '',
|
||||||
limitTime: [1, 2],
|
limitTime: [1, 2],
|
||||||
role: [],
|
role: [],
|
||||||
@@ -151,6 +179,14 @@ const rules: Partial<Record<string, Array<FormItemRule>>> = {
|
|||||||
trigger: 'blur'
|
trigger: 'blur'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
idCardNum: [
|
||||||
|
{
|
||||||
|
pattern:
|
||||||
|
/(^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0[1-9]|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$)/,
|
||||||
|
message: '请输入正确的身份证号',
|
||||||
|
trigger: 'blur'
|
||||||
|
}
|
||||||
|
],
|
||||||
limitTime: [{ required: true, message: '时间段不能为空', trigger: 'blur' }],
|
limitTime: [{ required: true, message: '时间段不能为空', trigger: 'blur' }],
|
||||||
limitIpStart: [
|
limitIpStart: [
|
||||||
{ required: true, message: '起始IP不能为空', trigger: 'blur' },
|
{ required: true, message: '起始IP不能为空', trigger: 'blur' },
|
||||||
@@ -198,7 +234,22 @@ const TypeOptions = [
|
|||||||
{ label: '长期用户', value: 1 }
|
{ label: '长期用户', value: 1 }
|
||||||
]
|
]
|
||||||
const useId = ref(1)
|
const useId = ref(1)
|
||||||
|
const idCardEditing = ref(false)
|
||||||
const roleOptions = ref<treeData>()
|
const roleOptions = ref<treeData>()
|
||||||
|
|
||||||
|
const maskIdCard = (value: string) => {
|
||||||
|
if (!value || value.length < 8) return value
|
||||||
|
if (value.length >= 18) return value.slice(0, 6) + '********' + value.slice(-4)
|
||||||
|
if (value.length >= 15) return value.slice(0, 6) + '*****' + value.slice(-4)
|
||||||
|
return value.slice(0, 3) + '*'.repeat(Math.max(value.length - 7, 1)) + value.slice(-4)
|
||||||
|
}
|
||||||
|
|
||||||
|
const idCardDisplay = computed(() => {
|
||||||
|
if (title.value === '新增用户' || idCardEditing.value || !form.idCardNum) {
|
||||||
|
return form.idCardNum
|
||||||
|
}
|
||||||
|
return maskIdCard(form.idCardNum)
|
||||||
|
})
|
||||||
const queryRole = () => {
|
const queryRole = () => {
|
||||||
roleList(adminInfo.$state.userType).then((res: any) => {
|
roleList(adminInfo.$state.userType).then((res: any) => {
|
||||||
roleOptions.value = res.data.map((item: any) => {
|
roleOptions.value = res.data.map((item: any) => {
|
||||||
@@ -215,6 +266,7 @@ const title = ref('新增用户')
|
|||||||
const open = (text: string, data?: anyObj) => {
|
const open = (text: string, data?: anyObj) => {
|
||||||
title.value = text
|
title.value = text
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
|
idCardEditing.value = false
|
||||||
if (data) {
|
if (data) {
|
||||||
for (let key in form) {
|
for (let key in form) {
|
||||||
form[key] = data[key]
|
form[key] = data[key]
|
||||||
@@ -240,9 +292,9 @@ const open = (text: string, data?: anyObj) => {
|
|||||||
form.type = adminInfo.$state.userType + 1
|
form.type = adminInfo.$state.userType + 1
|
||||||
}
|
}
|
||||||
const submit = async () => {
|
const submit = async () => {
|
||||||
formRef.value.validate(async (valid: boolean) => {
|
formRef.value.validate(async (valid: boolean) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
let obj = JSON.parse(JSON.stringify(form))
|
let obj = JSON.parse(JSON.stringify(form))
|
||||||
obj.limitTime = obj.limitTime.join('-')
|
obj.limitTime = obj.limitTime.join('-')
|
||||||
delete obj.password
|
delete obj.password
|
||||||
if (form.id) {
|
if (form.id) {
|
||||||
@@ -257,7 +309,6 @@ const submit = async () => {
|
|||||||
dialogVisible.value = false
|
dialogVisible.value = false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleInput = (field: keyof typeof form, value: string) => {
|
const handleInput = (field: keyof typeof form, value: string) => {
|
||||||
@@ -268,6 +319,14 @@ const handleInput = (field: keyof typeof form, value: string) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleIdCardInput = (value: string) => {
|
||||||
|
form.idCardNum = value.replace(/\s/g, '').replace(/[^0-9xX]/g, '').toUpperCase().slice(0, 18)
|
||||||
|
}
|
||||||
|
|
||||||
|
const onIdCardBlur = () => {
|
||||||
|
idCardEditing.value = false
|
||||||
|
}
|
||||||
|
|
||||||
const changeValue = () => {}
|
const changeValue = () => {}
|
||||||
defineExpose({ open })
|
defineExpose({ open })
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user