feat: 权限设置静态交互主体完成
parent
bf96269ef4
commit
1f2db187a5
@ -0,0 +1,18 @@
|
|||||||
|
// 最小化
|
||||||
|
export const clientMinimizeWeb = () => {
|
||||||
|
electron.ipcRenderer.invoke('renderer-to-main', {
|
||||||
|
name: 'min-win'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 最大化
|
||||||
|
export const clientMaximizeWeb = () => {
|
||||||
|
electron.ipcRenderer.invoke('renderer-to-main', {
|
||||||
|
name: 'max-win'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 关闭
|
||||||
|
export const clientCloseWeb = () => {
|
||||||
|
electron.ipcRenderer.invoke('renderer-to-main', {
|
||||||
|
name: 'win-close'
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -0,0 +1,262 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2025-07-04 10:36:19
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2025-07-07 17:29:54
|
||||||
|
* @FilePath: \Robot-Al-Platform-Web\src\renderer\src\views\Design\Settings\permission.vue
|
||||||
|
* @Description: 权限设置
|
||||||
|
3、完善交互效果
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="settings_permission_wrap">
|
||||||
|
<el-form
|
||||||
|
style="max-width: 472px"
|
||||||
|
:model="formData"
|
||||||
|
label-width="auto"
|
||||||
|
label-position="top"
|
||||||
|
size="default"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<div class="el-form-item--label-top">
|
||||||
|
<div class="el-form-item__label">
|
||||||
|
<span>权限导入导出</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex">
|
||||||
|
<el-form-item label="" class="mr-[8px]">
|
||||||
|
<el-button :type="formData?.import ? 'primary' : ''" @click="handleImport"
|
||||||
|
>导入</el-button
|
||||||
|
>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="">
|
||||||
|
<el-button :type="formData?.export ? 'primary' : ''" @click="handleExport"
|
||||||
|
>导出</el-button
|
||||||
|
>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-form-item label="">
|
||||||
|
<span>{{ formData.encryption ? '开启' : '关闭' }}加密</span>
|
||||||
|
<el-switch v-model="formData.encryption" class="pl-[12px]" />
|
||||||
|
</el-form-item>
|
||||||
|
<div v-if="formData.encryption">
|
||||||
|
<el-form-item label="修改管理员密码">
|
||||||
|
<el-button @click="handleUpdatePassword">修改密码</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="技术员权限">
|
||||||
|
<el-switch v-model="formData.technicianPermission" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="技术员密码">
|
||||||
|
<el-input
|
||||||
|
v-model="formData.technicianPassword"
|
||||||
|
placeholder="请输入密码"
|
||||||
|
type="password"
|
||||||
|
show-password
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="技术员权限配置">
|
||||||
|
<el-button @click="() => (showPermissionDialog = true)">配置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="操作员权限">
|
||||||
|
<el-switch v-model="formData.operatorPermission" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="操作员密码">
|
||||||
|
<el-input
|
||||||
|
v-model="formData.operatorPassword"
|
||||||
|
placeholder="请输入密码"
|
||||||
|
type="password"
|
||||||
|
show-password
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="操作员使能">
|
||||||
|
<el-switch v-model="formData.operatorEnabled" />
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
</el-form>
|
||||||
|
<!-- 修改管理员密码 -->
|
||||||
|
<el-dialog
|
||||||
|
align-center
|
||||||
|
v-model="showTechnicianPswDialog"
|
||||||
|
width="520"
|
||||||
|
@close="showTechnicianPswDialog = false"
|
||||||
|
class="settings-dialog design-dialog"
|
||||||
|
>
|
||||||
|
<template #header="{ close, titleId, titleClass }">
|
||||||
|
<div class="flex items-center justify-between h-full dialog-header pl-[24px]">
|
||||||
|
<p class="overflow-hidden whitespace-nowrap text-ellipsis">设置管理员密码</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<div class="p-[24px]">
|
||||||
|
<el-form
|
||||||
|
ref="updatePswFormRef"
|
||||||
|
style="max-width: 472px"
|
||||||
|
:model="updatePswFromData"
|
||||||
|
label-width="auto"
|
||||||
|
label-position="top"
|
||||||
|
size="default"
|
||||||
|
:rules="pswFormRules"
|
||||||
|
>
|
||||||
|
<el-form-item label="设置密码" prop="pass">
|
||||||
|
<el-input v-model="updatePswFromData.pass" type="password" autocomplete="off" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="确认密码" prop="checkPass">
|
||||||
|
<el-input v-model="updatePswFromData.checkPass" type="password" autocomplete="off" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer mr-[24px] pb-[24px] pt-[16px]">
|
||||||
|
<el-button type="info" size="default" @click="resetPswFromData(updatePswFormRef)" class=""
|
||||||
|
>重置</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="default"
|
||||||
|
@click="submitUpdatePswForm(updatePswFormRef)"
|
||||||
|
class=""
|
||||||
|
>确定</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
<!-- //TODO 配置操作员权限 -->
|
||||||
|
<el-dialog
|
||||||
|
align-center
|
||||||
|
v-model="showPermissionDialog"
|
||||||
|
width="520"
|
||||||
|
@close="showPermissionDialog = false"
|
||||||
|
class="settings-dialog design-dialog"
|
||||||
|
>
|
||||||
|
<template #header="{ close, titleId, titleClass }">
|
||||||
|
<div class="flex items-center justify-between h-full dialog-header pl-[24px]">
|
||||||
|
<p class="overflow-hidden whitespace-nowrap text-ellipsis">权限分配</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<div class="p-[24px]">
|
||||||
|
<el-form
|
||||||
|
style="max-width: 472px"
|
||||||
|
:model="permissionFromData"
|
||||||
|
label-width="auto"
|
||||||
|
label-position="top"
|
||||||
|
size="default"
|
||||||
|
>
|
||||||
|
<el-form-item label="选择开放给技术员的工具权限" prop="pass">
|
||||||
|
<el-checkbox label="所有权限"></el-checkbox>
|
||||||
|
<!-- <el-checkbox
|
||||||
|
v-model="checkAll"
|
||||||
|
:indeterminate="isIndeterminate"
|
||||||
|
@change="handleCheckAllChange"
|
||||||
|
>
|
||||||
|
</el-checkbox> -->
|
||||||
|
<!-- @change="handleCheckedPermissionChange" -->
|
||||||
|
<el-checkbox-group v-model="permissionFromData.permission" >
|
||||||
|
<el-checkbox
|
||||||
|
v-for="v in ['权限1', '权限2', '权限3', '权限4', '权限5']"
|
||||||
|
:key="v"
|
||||||
|
:label="v"
|
||||||
|
:value="v"
|
||||||
|
>
|
||||||
|
</el-checkbox>
|
||||||
|
</el-checkbox-group>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer mr-[24px] pb-[24px] pt-[16px]">
|
||||||
|
<el-button type="info" size="default" @click="resetPermission()" class="">取消</el-button>
|
||||||
|
<el-button type="primary" size="default" @click="submitPermission()" class=""
|
||||||
|
>确定</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
const formData = reactive({
|
||||||
|
import: false, // 导入权限
|
||||||
|
export: false, // 导出权限
|
||||||
|
encryption: false, // 关闭加密权限
|
||||||
|
technicianPermission: false, // 技术员权限
|
||||||
|
technicianPassword: '', // 技术员密码
|
||||||
|
operatorPermission: false, // 操作员权限
|
||||||
|
operatorPassword: '', // 操作员密码
|
||||||
|
operatorEnabled: true
|
||||||
|
})
|
||||||
|
|
||||||
|
const showTechnicianPswDialog = ref<boolean>(false) // 技术员密码弹窗
|
||||||
|
|
||||||
|
const updatePswFormRef = ref<FormInstance>() // 技术员密码表单
|
||||||
|
const updatePswFromData = reactive({
|
||||||
|
pass: '',
|
||||||
|
checkPass: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const showPermissionDialog = ref<boolean>(false) // 操作员权限弹窗
|
||||||
|
const permissionFromData = reactive({
|
||||||
|
permission: [],
|
||||||
|
})
|
||||||
|
|
||||||
|
/**管理员重置密码 */
|
||||||
|
const validatePass = (rule: any, value: any, callback: any) => {
|
||||||
|
if (value === '') {
|
||||||
|
callback(new Error('请输入密码'))
|
||||||
|
} else {
|
||||||
|
if (updatePswFromData.checkPass !== '') {
|
||||||
|
if (!updatePswFormRef.value) return
|
||||||
|
updatePswFormRef.value.validateField('checkPass')
|
||||||
|
}
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const validatePass2 = (rule: any, value: any, callback: any) => {
|
||||||
|
if (value === '') {
|
||||||
|
callback(new Error('请再次输入密码'))
|
||||||
|
} else if (value !== updatePswFromData.pass) {
|
||||||
|
callback(new Error('两次密码不一致'))
|
||||||
|
} else {
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const pswFormRules = reactive<FormRules<typeof updatePswFromData>>({
|
||||||
|
pass: [{ validator: validatePass, trigger: 'blur' }],
|
||||||
|
checkPass: [{ validator: validatePass2, trigger: 'blur' }]
|
||||||
|
})
|
||||||
|
|
||||||
|
const handleUpdatePassword = () => {
|
||||||
|
console.log('Technician Config')
|
||||||
|
showTechnicianPswDialog.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
const submitUpdatePswForm = (formEl: FormInstance | undefined) => {
|
||||||
|
if (!formEl) return
|
||||||
|
formEl.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
console.log('submit!')
|
||||||
|
} else {
|
||||||
|
console.log('error submit!')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const resetPswFromData = (formEl: FormInstance | undefined) => {
|
||||||
|
if (!formEl) return
|
||||||
|
formEl.resetFields()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**导入、导出 */
|
||||||
|
|
||||||
|
const handleImport = () => {
|
||||||
|
console.log('Import')
|
||||||
|
formData.import = !formData.import
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleExport = () => {
|
||||||
|
console.log('Export')
|
||||||
|
formData.export = !formData.export
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
方案设置
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@ -1,58 +1,53 @@
|
|||||||
.settings-dialog {
|
.settings-dialog {
|
||||||
/* Your dialog styles */
|
/* Your dialog styles */
|
||||||
|
// background-color: #363940 !important;
|
||||||
|
|
||||||
background-color: #363940 !important;
|
background-color: #2d3a4b;
|
||||||
height: 736px;
|
|
||||||
|
|
||||||
.settings-container {
|
.settings-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 400px; /* Adjust as needed */
|
min-height: 632px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-sidebar {
|
.settings-sidebar {
|
||||||
width: 200px;
|
width: 120px;
|
||||||
background-color: #2d3a4b; /* Dark background */
|
padding: 24px;
|
||||||
color: #fff;
|
}
|
||||||
padding: 20px;
|
.settings-line {
|
||||||
}
|
position: absolute;
|
||||||
|
left: 120px;
|
||||||
.sidebar-item {
|
width: 1px;
|
||||||
padding: 10px;
|
height: 100vh;
|
||||||
|
background-color: #fff;
|
||||||
|
opacity: 0.3;
|
||||||
|
}
|
||||||
|
.sidebar-item {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 16px;
|
||||||
}
|
opacity: 0.3;
|
||||||
|
&.active {
|
||||||
.sidebar-item:hover,
|
opacity: 1;
|
||||||
.sidebar-item.active {
|
}
|
||||||
background-color: #3c4b64;
|
}
|
||||||
}
|
|
||||||
|
// .sidebar-item:hover,
|
||||||
.sidebar-item .el-icon {
|
// .sidebar-item.active {
|
||||||
margin-right: 5px;
|
// background-color: #3c4b64;
|
||||||
}
|
// }
|
||||||
|
|
||||||
.settings-content {
|
.settings-content {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding: 20px;
|
padding: 24px 24px 12px;
|
||||||
color: #fff;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.section {
|
.section {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.section-title {
|
.section-title {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-group {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-group .el-button {
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
软件设置
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2025-07-04 10:57:20
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2025-07-04 10:58:12
|
||||||
|
* @FilePath: \Robot-Al-Platform-Web\src\renderer\src\views\Design\Settings\strategy.vue
|
||||||
|
* @Description: 运行策略
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
运行策略
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
Loading…
Reference in New Issue