qdintc/intc-single-ultra-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 功能bug修复，完善。

Browse Source
This commit is contained in:
tianyongbao
2026-02-07 23:24:13 +08:00
parent f2d6171e61
commit cd5b0f6765
10 changed files with 278 additions and 329 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/pages_mine/pages/system/config/addEdit.vue
View File

@@ -26,12 +26,10 @@
inputAlign="left" :customStyle="getInputStyle('configValue')"></u--input>
</u-form-item>
<u-form-item label="系统内置" prop="typeName" @click="showTypePicker = true">
<view class="select-input-wrapper">
<u-form-item label="系统内置" prop="typeName" @click="showTypePicker = true" class="with-arrow">
<u--input v-model="typeName" disabled disabledColor="#ffffff" placeholder="请选择系统内置"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
</u-form-item>
<u-form-item label="备注" prop="remark" labelPosition="top">
@@ -180,11 +178,7 @@ function submit() {
if (errors && Array.isArray(errors)) {
errorFields.value = errors.map(err => err.field || err.prop)
}
console.log('验证失败')
proxy.$refs['uToast'].show({
type: 'error',
message: '请填写完整信息'
})
proxy.$modal.msgError('请填写完整信息')
})
}
</script>

20
src/pages_mine/pages/system/dept/addEdit.vue
View File

@@ -11,12 +11,12 @@
<view class="form-view">
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
<u-form-item label="上级部门" prop="parentName" @click="showDeptPicker = true">
<view class="select-input-wrapper">
<u-form-item label="上级部门" prop="parentName" @click="showDeptPicker = true" class="with-arrow">
<u--input v-model="parentName" disabled disabledColor="#ffffff" placeholder="请选择上级部门"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
</u-form-item>
<u-form-item label="部门名称" prop="deptName" required>
@@ -43,12 +43,11 @@
inputAlign="left" :customStyle="getInputStyle('email')"></u--input>
</u-form-item>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
<view class="select-input-wrapper">
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true" class="with-arrow">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
</u-form-item>
</u--form>
<view class="form-btn">
@@ -274,10 +273,7 @@ function submit() {
if (errors && Array.isArray(errors)) {
errorFields.value = errors.map(err => err.field || err.prop)
}
proxy.$refs['uToast'].show({
type: 'error',
message: '请填写完整信息'
})
proxy.$modal.msgError('请填写完整信息')
})
}
</script>

53
src/pages_mine/pages/system/dict/addEdit.vue
View File

@@ -31,7 +31,6 @@
</view>
</view>
</view>
<u-toast ref="uToast"></u-toast>
</view>
</template>
@@ -60,7 +59,9 @@ const inputBaseStyle = {
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 输入框错误样式
@@ -69,7 +70,9 @@ const inputErrorStyle = {
border: '2rpx solid #f56c6c',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 根据字段名获取输入框样式
@@ -103,28 +106,20 @@ function getDetail(id) {
// 提交
function submit() {
errorFields.value = [] // 清空错误字段
console.log('submit 被调用')
proxy.$refs['uForm'].validate().then(() => {
console.log('验证通过', form.dictId)
if (form.dictId) {
updateType(form).then(() => {
console.log('修改成功,将跳转')
proxy.$refs['uToast'].show({
message: '修改成功', complete() {
console.log('complete 被调用,执行跳转')
uni.navigateTo({ url: `/pages_mine/pages/system/dict/list` })
}
})
proxy.$modal.msgSuccess('修改成功')
setTimeout(() => {
uni.navigateTo({ url: `/pages_mine/pages/system/dict/list` })
}, 1500)
})
} else {
addType(form).then(() => {
console.log('新增成功,将跳转')
proxy.$refs['uToast'].show({
message: '新增成功', complete() {
console.log('complete 被调用,执行跳转')
uni.navigateTo({ url: `/pages_mine/pages/system/dict/list` })
}
})
proxy.$modal.msgSuccess('新增成功')
setTimeout(() => {
uni.navigateTo({ url: `/pages_mine/pages/system/dict/list` })
}, 1500)
})
}
}).catch((errors) => {
@@ -132,11 +127,7 @@ function submit() {
if (errors && Array.isArray(errors)) {
errorFields.value = errors.map(err => err.field || err.prop)
}
console.log('验证失败')
proxy.$refs['uToast'].show({
type: 'error',
message: '请填写完整信息'
})
proxy.$modal.msgError('请填写完整信息')
})
}
</script>
@@ -182,20 +173,6 @@ function submit() {
}
}
}
.select-input-wrapper {
position: relative;
.select-arrow {
position: absolute;
right: 24rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 28rpx;
pointer-events: none;
}
}
</style>
<style lang="scss">

6
src/pages_mine/pages/system/dictData/addEdit.vue
View File

@@ -31,12 +31,10 @@
inputAlign="left" :customStyle="getInputStyle('dictSort')"></u--input>
</u-form-item>
<u-form-item label="回显样式" prop="listClassName" @click="showListClassPicker = true">
<view class="select-input-wrapper">
<u-form-item label="回显样式" prop="listClassName" @click="showListClassPicker = true" class="with-arrow">
<u--input v-model="listClassName" disabled disabledColor="#ffffff" placeholder="请选择回显样式"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
</u-form-item>
<u-form-item label="备注" prop="remark" labelPosition="top">

72
src/pages_mine/pages/system/menu/addEdit.vue
View File

@@ -12,25 +12,19 @@
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
<u-form-item label="上级菜单" prop="parentName" @click="showParentPicker = true">
<u-form-item label="上级菜单" prop="parentName" @click="showParentPicker = true" class="with-arrow">
<u--input v-model="parentName" disabled disabledColor="#ffffff" placeholder="请选择上级菜单"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="菜单类型" prop="menuTypeName" @click="showMenuTypePicker = true">
<u-form-item label="菜单类型" prop="menuTypeName" @click="showMenuTypePicker = true" class="with-arrow">
<u--input v-model="menuTypeName" disabled disabledColor="#ffffff" placeholder="请选择菜单类型"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="菜单名称" prop="menuName" required>
<u--input v-model="form.menuName" placeholder="请输入菜单名称" maxlength="50"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="getInputStyle('menuName')"></u--input>
</u-form-item>
<u-form-item label="显示排序">
@@ -39,49 +33,37 @@
<u-form-item label="路由地址" v-if="form.menuType !== 'F'">
<u--input v-model="form.path" placeholder="请输入路由地址" maxlength="200"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="getInputStyle('path')"></u--input>
</u-form-item>
<u-form-item label="组件路径" v-if="form.menuType === 'C'">
<u--input v-model="form.component" placeholder="请输入组件路径" maxlength="255"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="getInputStyle('component')"></u--input>
</u-form-item>
<u-form-item label="权限标识" v-if="form.menuType !== 'M'">
<u--input v-model="form.perms" placeholder="请输入权限标识" maxlength="100"
inputAlign="right" border="none"></u--input>
inputAlign="left" :customStyle="getInputStyle('perms')"></u--input>
</u-form-item>
<u-form-item label="是否外链" v-if="form.menuType !== 'F'" @click="showFramePicker = true">
<u-form-item label="是否外链" v-if="form.menuType !== 'F'" @click="showFramePicker = true" class="with-arrow">
<u--input v-model="frameName" disabled disabledColor="#ffffff" placeholder="请选择"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="是否缓存" v-if="form.menuType === 'C'" @click="showCachePicker = true">
<u-form-item label="是否缓存" v-if="form.menuType === 'C'" @click="showCachePicker = true" class="with-arrow">
<u--input v-model="cacheName" disabled disabledColor="#ffffff" placeholder="请选择"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="显示状态" v-if="form.menuType !== 'F'" @click="showVisiblePicker = true">
<u-form-item label="显示状态" v-if="form.menuType !== 'F'" @click="showVisiblePicker = true" class="with-arrow">
<u--input v-model="visibleName" disabled disabledColor="#ffffff" placeholder="请选择"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="菜单状态" prop="statusName" @click="showStatusPicker = true">
<u-form-item label="菜单状态" prop="statusName" @click="showStatusPicker = true" class="with-arrow">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="right" border="none"></u--input>
<template #right>
<u-icon name="arrow-down"></u-icon>
</template>
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
</u--form>
@@ -181,7 +163,9 @@ const inputBaseStyle = {
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 输入框错误样式
@@ -190,7 +174,9 @@ const inputErrorStyle = {
border: '2rpx solid #f56c6c',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 根据字段名获取输入框样式
@@ -436,20 +422,6 @@ function submit() {
}
}
}
.select-input-wrapper {
position: relative;
.select-arrow {
position: absolute;
right: 24rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 28rpx;
pointer-events: none;
}
}
</style>
<style lang="scss">

159
src/pages_mine/pages/system/notice/addEdit.vue
View File

@@ -9,21 +9,21 @@
<view class="section">
<view class="section-title">公告信息</view>
<view class="form-view">
<u--form labelPosition="left" :model="form" ref="uForm">
<u-form-item label="公告标题" prop="noticeTitle" borderBottom required>
<u--input v-model="form.noticeTitle" placeholder="请输入公告标题" border="none"></u--input>
<u--form labelPosition="left" :model="form" ref="uForm" labelWidth="160rpx"
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
<u-form-item label="公告标题" prop="noticeTitle" required>
<u--input v-model="form.noticeTitle" placeholder="请输入公告标题"
inputAlign="left" :customStyle="getInputStyle('noticeTitle')"></u--input>
</u-form-item>
<u-form-item label="公告类型" prop="noticeType" borderBottom required>
<u-radio-group v-model="form.noticeType" placement="row">
<u-radio v-for="item in noticeTypeList" :key="item.dictValue" :name="item.dictValue" :label="item.dictLabel">
</u-radio>
</u-radio-group>
<u-form-item label="公告类型" prop="noticeType" required @click="showNoticeTypePicker = true" class="with-arrow">
<u--input v-model="noticeTypeName" disabled disabledColor="#ffffff" placeholder="请选择公告类型"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="状态" prop="status" borderBottom>
<u-radio-group v-model="form.status" placement="row">
<u-radio v-for="item in statusList" :key="item.dictValue" :name="item.dictValue" :label="item.dictLabel">
</u-radio>
</u-radio-group>
<u-form-item label="状态" prop="status" @click="showStatusPicker = true" class="with-arrow">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="内容" prop="noticeContent" labelPosition="top">
<view class="editor-container">
@@ -72,7 +72,14 @@
</view>
</view>
</view>
<u-toast ref="uToast"></u-toast>
<!-- 公告类型选择器 -->
<u-picker itemHeight="88" :show="showNoticeTypePicker" :columns="noticeTypeColumns" keyName="dictLabel"
@cancel="showNoticeTypePicker = false" @confirm="handleNoticeTypeConfirm"></u-picker>
<!-- 状态选择器 -->
<u-picker itemHeight="88" :show="showStatusPicker" :columns="statusColumns" keyName="dictLabel"
@cancel="showStatusPicker = false" @confirm="handleStatusConfirm"></u-picker>
</view>
</template>
@@ -87,6 +94,12 @@ const title = ref('新增公告')
const noticeId = ref(undefined)
const noticeTypeList = ref([])
const statusList = ref([])
const noticeTypeColumns = ref([])
const statusColumns = ref([])
const showNoticeTypePicker = ref(false)
const showStatusPicker = ref(false)
const noticeTypeName = ref('')
const statusName = ref('')
const editorCtx = ref(null)
const contentLength = ref(0)
@@ -107,7 +120,9 @@ const inputBaseStyle = {
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 输入框错误样式
@@ -116,7 +131,9 @@ const inputErrorStyle = {
border: '2rpx solid #f56c6c',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 根据字段名获取输入框样式
@@ -125,18 +142,16 @@ const getInputStyle = (field) => {
}
onLoad((options) => {
console.log('页面加载参数:', options)
if (options.id) {
noticeId.value = options.id
title.value = '修改公告'
console.log('加载公告详情，ID:', noticeId.value)
getNotice(noticeId.value).then(response => {
console.log('获取到的公告数据:', response.data)
Object.assign(form, response.data)
console.log('表单数据初始化完成:', form)
// 更新显示名称
updateNoticeTypeName()
updateStatusName()
// 如果编辑器已经初始化，设置内容
if (editorCtx.value && form.noticeContent) {
console.log('设置编辑器初始内容:', form.noticeContent)
editorCtx.value.setContents({
html: form.noticeContent
})
@@ -147,46 +162,71 @@ onLoad((options) => {
}
// 获取字典数据
console.log('开始获取字典数据')
getDicts('sys_notice_type').then(res => {
noticeTypeList.value = res.data
console.log('公告类型字典:', res.data)
noticeTypeColumns.value = [res.data]
// 如果是新增模式，设置默认值
if (!noticeId.value && res.data.length > 0) {
form.noticeType = res.data[0].dictValue
noticeTypeName.value = res.data[0].dictLabel
}
}).catch(error => {
console.error('获取公告类型字典失败:', error)
})
getDicts('sys_notice_status').then(res => {
statusList.value = res.data
console.log('公告状态字典:', res.data)
statusColumns.value = [res.data]
// 更新状态显示
updateStatusName()
}).catch(error => {
console.error('获取公告状态字典失败:', error)
})
})
// 更新公告类型显示名称
function updateNoticeTypeName() {
if (noticeTypeList.value.length > 0) {
const item = noticeTypeList.value.find(v => v.dictValue === form.noticeType)
noticeTypeName.value = item ? item.dictLabel : ''
}
}
// 更新状态显示名称
function updateStatusName() {
if (statusList.value.length > 0) {
const item = statusList.value.find(v => v.dictValue === form.status)
statusName.value = item ? item.dictLabel : ''
}
}
// 公告类型选择确认
function handleNoticeTypeConfirm(e) {
form.noticeType = e.value[0].dictValue
noticeTypeName.value = e.value[0].dictLabel
showNoticeTypePicker.value = false
}
// 状态选择确认
function handleStatusConfirm(e) {
form.status = e.value[0].dictValue
statusName.value = e.value[0].dictLabel
showStatusPicker.value = false
}
onReady(() => {
// 页面准备完成后的一些初始化操作
})
// 编辑器初始化完成
function onEditorReady() {
console.log('编辑器初始化完成')
uni.createSelectorQuery().select('#editor').context((res) => {
editorCtx.value = res.context
console.log('编辑器上下文获取成功:', editorCtx.value)
// 如果是编辑模式，设置初始内容
if (form.noticeContent) {
console.log('设置初始内容到编辑器:', form.noticeContent)
editorCtx.value.setContents({
html: form.noticeContent,
success: () => {
console.log('编辑器内容设置成功')
},
fail: (error) => {
console.error('编辑器内容设置失败:', error)
}
html: form.noticeContent
})
} else {
console.log('没有初始内容需要设置')
}
}).exec()
}
@@ -201,7 +241,6 @@ function onEditorInput(e) {
// 计算内容长度（去除HTML标签）
const text = res.text || ''
contentLength.value = text.length
console.log('编辑器内容已更新:', res.html)
}
})
}
@@ -218,10 +257,6 @@ function editorBlur() {
editorCtx.value.getContents({
success: (res) => {
form.noticeContent = res.html
console.log('失去焦点时保存的内容:', res.html)
},
fail: (error) => {
console.error('失去焦点时获取内容失败:', error)
}
})
}
@@ -334,7 +369,6 @@ async function submitForm() {
editorCtx.value.getContents({
success: (res) => {
form.noticeContent = res.html
console.log('提交前获取到的内容:', res.html)
resolve(res.html)
},
fail: reject
@@ -347,14 +381,12 @@ async function submitForm() {
doSubmit()
} catch (error) {
console.error('获取编辑器内容失败:', error)
modal.msgError('获取内容失败，请重试')
}
}
function doSubmit() {
errorFields.value = [] // 清空错误字段
console.log('准备提交的表单数据:', form)
if (!form.noticeTitle) {
errorFields.value.push('noticeTitle')
@@ -373,48 +405,23 @@ function doSubmit() {
}
const submitForm = { ...form }
console.log('最终提交的数据:', submitForm)
// 检查必要字段
console.log('检查字段:')
console.log('- 标题:', submitForm.noticeTitle)
console.log('- 类型:', submitForm.noticeType)
console.log('- 内容长度:', submitForm.noticeContent.length)
console.log('- 状态:', submitForm.status)
console.log('- ID:', submitForm.noticeId)
if (noticeId.value) {
console.log('执行修改操作')
updateNotice(submitForm).then(response => {
console.log('修改成功响应:', response)
modal.msgSuccess('修改成功')
setTimeout(() => {
uni.navigateBack()
}, 1000)
}).catch(error => {
console.error('修改失败:', error)
console.log('错误详情:', {
message: error.message,
response: error.response,
data: error.response?.data
})
modal.msgError('修改失败: ' + (error.message || '未知错误'))
})
} else {
console.log('执行新增操作')
addNotice(submitForm).then(response => {
console.log('新增成功响应:', response)
modal.msgSuccess('新增成功')
setTimeout(() => {
uni.navigateBack()
}, 1000)
}).catch(error => {
console.error('新增失败:', error)
console.log('错误详情:', {
message: error.message,
response: error.response,
data: error.response?.data
})
modal.msgError('新增失败: ' + (error.message || '未知错误'))
})
}
@@ -463,20 +470,6 @@ function doSubmit() {
}
}
.select-input-wrapper {
position: relative;
.select-arrow {
position: absolute;
right: 24rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 28rpx;
pointer-events: none;
}
}
.editor-container {
width: 100%;
border: 2rpx solid #e8edf3;

52
src/pages_mine/pages/system/post/addEdit.vue
View File

@@ -25,12 +25,9 @@
<u-number-box v-model="form.postSort" :min="0" :max="999" inputAlign="right"></u-number-box>
</u-form-item>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
<view class="select-input-wrapper">
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true" class="with-arrow">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
</u-form-item>
<u-form-item label="备注" prop="remark" labelPosition="top">
@@ -43,7 +40,6 @@
</view>
</view>
</view>
<u-toast ref="uToast"></u-toast>
<u-picker itemHeight="88" :show="showStatusPicker" :columns="statusList" keyName="dictLabel" @cancel="showStatusPicker = false"
@confirm="handleStatusConfirm"></u-picker>
</view>
@@ -79,7 +75,9 @@ const inputBaseStyle = {
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 输入框错误样式
@@ -88,7 +86,9 @@ const inputErrorStyle = {
border: '2rpx solid #f56c6c',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 根据字段名获取输入框样式
@@ -147,22 +147,19 @@ function handleStatusConfirm(e) {
function submit() {
errorFields.value = [] // 清空错误字段
proxy.$refs['uForm'].validate().then(() => {
console.log('提交的表单数据:', form)
if (form.postId) {
updatePost(form).then(() => {
proxy.$refs['uToast'].show({
message: '修改成功', complete() {
uni.navigateTo({ url: `/pages_mine/pages/system/post/list` })
}
})
proxy.$modal.msgSuccess('修改成功')
setTimeout(() => {
uni.navigateTo({ url: `/pages_mine/pages/system/post/list` })
}, 1500)
})
} else {
addPost(form).then(() => {
proxy.$refs['uToast'].show({
message: '新增成功', complete() {
uni.navigateTo({ url: `/pages_mine/pages/system/post/list` })
}
})
proxy.$modal.msgSuccess('新增成功')
setTimeout(() => {
uni.navigateTo({ url: `/pages_mine/pages/system/post/list` })
}, 1500)
})
}
}).catch((errors) => {
@@ -170,10 +167,7 @@ function submit() {
if (errors && Array.isArray(errors)) {
errorFields.value = errors.map(err => err.field || err.prop)
}
proxy.$refs['uToast'].show({
type: 'error',
message: '请填写完整信息'
})
proxy.$modal.msgError('请填写完整信息')
})
}
</script>
@@ -215,20 +209,6 @@ function submit() {
}
}
}
.select-input-wrapper {
position: relative;
.select-arrow {
position: absolute;
right: 24rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 28rpx;
pointer-events: none;
}
}
</style>
<style lang="scss">

40
src/pages_mine/pages/system/role/addEdit.vue
View File

@@ -26,12 +26,9 @@
<u-number-box v-model="form.roleSort" :min="0" :max="999" inputAlign="right"></u-number-box>
</u-form-item>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
<view class="select-input-wrapper">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true" class="with-arrow">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="备注" prop="remark" labelPosition="top">
@@ -39,12 +36,9 @@
inputAlign="left" :customStyle="getInputStyle('remark')"></u--input>
</u-form-item>
<u-form-item label="菜单权限" @click="openMenuPicker">
<view class="select-input-wrapper">
<u--input :value="menuPermissionText" disabled disabledColor="#ffffff" placeholder="请选择菜单权限"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="菜单权限" @click="openMenuPicker" class="with-arrow">
<u--input :value="menuPermissionText" disabled disabledColor="#ffffff" placeholder="请选择菜单权限"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<!-- 已选菜单标签展示 -->
@@ -164,7 +158,9 @@ const inputBaseStyle = {
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 输入框错误样式
@@ -173,7 +169,9 @@ const inputErrorStyle = {
border: '2rpx solid #f56c6c',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 根据字段名获取输入框样式
@@ -536,20 +534,6 @@ function submit() {
}
}
}
.select-input-wrapper {
position: relative;
.select-arrow {
position: absolute;
right: 24rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 28rpx;
pointer-events: none;
}
}
</style>
<style lang="scss">

153
src/pages_mine/pages/system/user/addEdit.vue
View File

@@ -36,28 +36,19 @@
inputAlign="left" :customStyle="getInputStyle('email')"></u--input>
</u-form-item>
<u-form-item label="用户性别" prop="sexName" @click="showSexPicker = true">
<view class="select-input-wrapper">
<u--input v-model="sexName" disabled disabledColor="#ffffff" placeholder="请选择性别"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="用户性别" prop="sexName" @click="showSexPicker = true" class="with-arrow">
<u--input v-model="sexName" disabled disabledColor="#ffffff" placeholder="请选择性别"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="归属部门" prop="deptName" @click="showDeptPicker = true">
<view class="select-input-wrapper">
<u--input v-model="deptName" disabled disabledColor="#ffffff" placeholder="请选择归属部门"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="归属部门" prop="deptName" @click="showDeptPicker = true" class="with-arrow">
<u--input v-model="deptName" disabled disabledColor="#ffffff" placeholder="请选择归属部门"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="岗位" prop="postNames" @click="openPostPicker">
<view class="select-input-wrapper">
<u--input :value="postNamesText" disabled disabledColor="#ffffff" placeholder="请选择岗位"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="岗位" prop="postNames" @click="openPostPicker" class="with-arrow">
<u--input :value="postNamesText" disabled disabledColor="#ffffff" placeholder="请选择岗位"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<!-- 已选岗位标签展示 -->
@@ -70,12 +61,9 @@
</view>
</view>
<u-form-item label="角色" prop="roleNames" @click="openRolePicker">
<view class="select-input-wrapper">
<u--input :value="roleNamesText" disabled disabledColor="#ffffff" placeholder="请选择角色"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="角色" prop="roleNames" @click="openRolePicker" class="with-arrow">
<u--input :value="roleNamesText" disabled disabledColor="#ffffff" placeholder="请选择角色"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<!-- 已选角色标签展示 -->
@@ -88,12 +76,9 @@
</view>
</view>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
<view class="select-input-wrapper">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
<u-icon name="arrow-down" class="select-arrow"></u-icon>
</view>
<u-form-item label="状态" prop="statusName" @click="showStatusPicker = true" class="with-arrow">
<u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
inputAlign="left" :customStyle="inputBaseStyle"></u--input>
</u-form-item>
<u-form-item label="备注" prop="remark" labelPosition="top">
@@ -220,7 +205,9 @@ const inputBaseStyle = {
border: '2rpx solid #dcdfe6',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 输入框错误样式
@@ -229,7 +216,9 @@ const inputErrorStyle = {
border: '2rpx solid #f56c6c',
borderRadius: '8rpx',
padding: '0 24rpx',
height: '68rpx'
height: '68rpx',
width: '100%',
boxSizing: 'border-box'
}
// 根据字段名获取输入框样式
@@ -545,21 +534,6 @@ function submit() {
padding-top: 16rpx;
}
// 下拉选择输入框容器
.select-input-wrapper {
position: relative;
.select-arrow {
position: absolute;
right: 24rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 28rpx;
pointer-events: none;
}
}
.selected-tags {
margin-top: 16rpx;
padding: 20rpx;
@@ -592,74 +566,111 @@ function submit() {
.select-popup {
background: #fff;
max-height: 80vh;
max-height: 85vh;
display: flex;
flex-direction: column;
border-radius: 24rpx 24rpx 0 0;
.popup-header {
padding: 32rpx 24rpx 24rpx;
border-bottom: 1rpx solid #f0f0f0;
padding: 40rpx 32rpx 32rpx;
background: linear-gradient(135deg, rgba(102, 126, 234, 0.05) 0%, rgba(118, 75, 162, 0.05) 100%);
border-bottom: 2rpx solid #f5f5f5;
position: relative;
&::after {
content: '';
position: absolute;
top: 16rpx;
left: 50%;
transform: translateX(-50%);
width: 80rpx;
height: 6rpx;
background: #e0e0e0;
border-radius: 3rpx;
}
.header-title {
font-size: 32rpx;
font-size: 34rpx;
font-weight: 600;
color: #333;
margin-bottom: 8rpx;
margin-bottom: 12rpx;
display: block;
letter-spacing: 1rpx;
}
.header-count {
font-size: 24rpx;
font-size: 26rpx;
color: #667eea;
display: block;
font-weight: 500;
}
}
.popup-content {
flex: 1;
max-height: 60vh;
padding: 24rpx;
max-height: 55vh;
padding: 16rpx 32rpx 32rpx;
overflow-y: auto;
.checkbox-item {
padding: 16rpx 0;
border-bottom: 1rpx solid #f5f5f5;
padding: 24rpx 20rpx;
margin-bottom: 8rpx;
background: #fafafa;
border-radius: 12rpx;
border: 2rpx solid transparent;
transition: all 0.3s ease;
&:hover {
background: rgba(102, 126, 234, 0.05);
border-color: #667eea;
}
&:last-child {
margin-bottom: 0;
}
}
}
.popup-footer {
padding: 24rpx;
border-top: 1rpx solid #f0f0f0;
padding: 24rpx 32rpx 32rpx;
background: #fafafa;
display: flex;
gap: 24rpx;
box-shadow: 0 -4rpx 12rpx rgba(0, 0, 0, 0.05);
.footer-btn {
flex: 1;
height: 88rpx;
height: 92rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 16rpx;
border-radius: 20rpx;
font-size: 32rpx;
font-weight: 500;
transition: all 0.3s;
letter-spacing: 2rpx;
}
.cancel-btn {
background: #f5f7fa;
color: #909399;
background: #ffffff;
color: #666;
border: 2rpx solid #e0e0e0;
&:active {
background: #e8eaed;
background: #f5f5f5;
border-color: #d0d0d0;
}
}
.confirm-btn {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: #ffffff;
box-shadow: 0 4rpx 12rpx rgba(102, 126, 234, 0.3);
box-shadow: 0 6rpx 20rpx rgba(102, 126, 234, 0.4);
border: none;
&:active {
opacity: 0.8;
transform: translateY(2rpx);
box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.3);
}
}
}
@@ -681,6 +692,16 @@ function submit() {
letter-spacing: 2rpx !important;
}
/* 统一输入框宽度 */
.u-form-item__body {
flex: 1 !important;
}
.u-form-item__body .u--input {
width: 100% !important;
box-sizing: border-box !important;
}
// 备注框样式
.remark-textarea {
width: 100% !important;

40
src/static/scss/global.scss
View File

@@ -95,7 +95,7 @@
.form-view {
// 表单项间距
:deep(.u-form-item) {
margin-bottom: 5rpx;
margin-bottom: -20rpx;
position: relative;
}
@@ -179,8 +179,8 @@
border-color: #f56c6c !important;
}
// 下拉箭头放到输入框内部右侧
:deep(.u-form-item__body__right) {
// 下拉箭头放到输入框内部右侧（仅在有图标时生效）
:deep(.u-form-item__body__right:has(.u-icon)) {
position: absolute !important;
right: 24rpx !important;
top: 50% !important;
@@ -195,6 +195,40 @@
font-size: 28rpx !important;
}
// 带箭头的下拉选择框（使用 class="with-arrow"）
:deep(.with-arrow) {
position: relative;
cursor: pointer;
// 增加点击区域提示
.u-form-item__body {
cursor: pointer;
}
// disabled 输入框允许点击穿透（包括所有子元素）
.u--input,
.u--input *,
.u-input,
.u-input *,
.u-input__content,
.u-input__content * {
pointer-events: none !important;
}
// 用伪元素添加箭头，不影响布局宽度
&::after {
content: '▼';
position: absolute;
right: 20rpx;
top: 50%;
transform: translateY(-50%);
color: #c0c4cc;
font-size: 20rpx;
pointer-events: none;
z-index: 10;
}
}
// 统一图标颜色
:deep(.u-icon) {
color: #909399 !important;