feat: 多图采集模块初始化
parent
badb802edc
commit
24b390daa0
@ -0,0 +1,55 @@
|
|||||||
|
/* 弹框 */
|
||||||
|
.ds-dialog {
|
||||||
|
--el-dialog-padding-primary: 0; // 弹窗内边距
|
||||||
|
--el-dialog-bg-color: var(--ds-dialog-background-color) !important; // 弹窗背景颜色
|
||||||
|
padding: 0 !important;
|
||||||
|
overflow: hidden;
|
||||||
|
.el-dialog__header {
|
||||||
|
background-color: var(--ds-color-primary);
|
||||||
|
.el-dialog__title {
|
||||||
|
color: var(--ds-color-info);
|
||||||
|
line-height: var(--ds-dialog-header-height);
|
||||||
|
padding-left: var(--ds-dialog-header-padding);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-dialog__body {
|
||||||
|
color: var(--ds-color-info);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-dialog__footer {
|
||||||
|
--el-dialog-padding-primary: 0; // 弹窗内边距
|
||||||
|
}
|
||||||
|
.el-dialog__headerbtn,
|
||||||
|
.el-dialog__headerbtn:hover {
|
||||||
|
width: 68px;
|
||||||
|
height: var(--ds-dialog-header-height);
|
||||||
|
.ds-dialog-header {
|
||||||
|
height: var(--ds-dialog-header-height);
|
||||||
|
}
|
||||||
|
.el-dialog__close {
|
||||||
|
font-size: 20px;
|
||||||
|
color: var(--ds-color-info);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-dialog__header {
|
||||||
|
height: var(--ds-dialog-header-height);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 表单弹框
|
||||||
|
.ds-dialog-form-container {
|
||||||
|
.el-select__wrapper {
|
||||||
|
background: var(--ds-dialog-form-background-color) !important;
|
||||||
|
.el-select__selected-item {
|
||||||
|
color: var(--ds-color-info) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-input-number {
|
||||||
|
width: 100% !important;
|
||||||
|
.el-input-number__increase,
|
||||||
|
.el-input-number__decrease {
|
||||||
|
background: transparent !important;
|
||||||
|
color: var(--ds-color-info) !important;
|
||||||
|
border: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,4 +1,5 @@
|
|||||||
@import url("./base.scss");
|
@import url("./base.scss");
|
||||||
@import url("./global.scss");
|
@import url("./global.scss");
|
||||||
@import url("./element-plus.scss");
|
@import url("./element-plus.scss");
|
||||||
|
@import url("./ds-dialog.scss");
|
||||||
@import url("./design.scss");
|
@import url("./design.scss");
|
||||||
@ -0,0 +1,130 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2025-07-03 11:12:04
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2025-07-24 13:44:05
|
||||||
|
* @FilePath: \electron-project\Robot-Al\Robot-Al-Platform-Web\src\renderer\src\views\Design\FlowImagesCapture\imageNodeModel.vue
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<DSDialog
|
||||||
|
v-model="show"
|
||||||
|
width="800"
|
||||||
|
@close="handleClose"
|
||||||
|
class="settings-dialog ds-dialog"
|
||||||
|
title="图像源"
|
||||||
|
>
|
||||||
|
<div class="settings-container">
|
||||||
|
<div class="settings-sidebar">
|
||||||
|
<div
|
||||||
|
class="flex flex-col items-center justify-center sidebar-item"
|
||||||
|
:class="{ active: activeTab === v.value }"
|
||||||
|
@click="setActiveTab(v)"
|
||||||
|
v-for="(v, k) in settings"
|
||||||
|
:key="k"
|
||||||
|
>
|
||||||
|
<img src="@/assets/electron.svg" alt="" class="w-[32px]" />
|
||||||
|
<span>{{ v.label }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="settings-line"></div>
|
||||||
|
<ul class="settings-content">
|
||||||
|
<li v-if="activeTab === 'permission'"></li>
|
||||||
|
<!-- Add other tabs' content here -->
|
||||||
|
<li v-if="activeTab === 'software'">
|
||||||
|
<p>Software Settings Content</p>
|
||||||
|
</li>
|
||||||
|
<li v-if="activeTab === 'plan'">
|
||||||
|
<p>Plan Settings Content</p>
|
||||||
|
</li>
|
||||||
|
<li v-if="activeTab === 'strategy'">
|
||||||
|
<p>Strategy Settings Content</p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<template #footer>
|
||||||
|
<span class="flex justify-end pt-0 dialog-footer">
|
||||||
|
<DSButton type="primary" size="default" @click="handleConfirm" class="mr-[24px] mb-[24px]"
|
||||||
|
>确定</DSButton
|
||||||
|
>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</DSDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
// import ThemeSwitcher from '@/components/Theme/themeSwitcher.vue'
|
||||||
|
import { DSButton } from '@/components/Button'
|
||||||
|
import { DSDialog } from '@/components/Dialog'
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
/** 弹窗显隐 */
|
||||||
|
value: boolean
|
||||||
|
info: Record<string, any>
|
||||||
|
}
|
||||||
|
interface Emits {
|
||||||
|
(e: 'update:value', val: boolean): void
|
||||||
|
}
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
value: false
|
||||||
|
})
|
||||||
|
const emit = defineEmits<Emits>()
|
||||||
|
|
||||||
|
// 处理对话框关闭事件
|
||||||
|
const handleClose = () => {
|
||||||
|
// emits('close');
|
||||||
|
}
|
||||||
|
|
||||||
|
const show = computed({
|
||||||
|
get() {
|
||||||
|
return props.value
|
||||||
|
},
|
||||||
|
set(val: boolean) {
|
||||||
|
emit('update:value', val)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const activeTab = ref('permission')
|
||||||
|
|
||||||
|
interface SettingItem {
|
||||||
|
label: string
|
||||||
|
value: string // 可以是路由地址或者其他唯一标识
|
||||||
|
icon?: string // 可选的图标类名或URL
|
||||||
|
}
|
||||||
|
|
||||||
|
const settings: SettingItem[] = [
|
||||||
|
{
|
||||||
|
label: '权限设置',
|
||||||
|
value: 'permission',
|
||||||
|
icon: 'fa fa-cog' // 或者自定义的图标类名
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '软件设置',
|
||||||
|
value: 'software',
|
||||||
|
icon: 'fa fa-file-code-o' // 或者自定义的图标类名
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '方案设置',
|
||||||
|
value: 'scheme',
|
||||||
|
icon: 'fa fa-clipboard' // 或者自定义的图标类名
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '运行策略',
|
||||||
|
value: 'strategy',
|
||||||
|
icon: 'fa fa-play-circle-o' // 或者自定义的图标类名
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const setActiveTab = (tab: SettingItem) => {
|
||||||
|
activeTab.value = tab.value
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleConfirm = () => {
|
||||||
|
console.log('Confirm')
|
||||||
|
// Implement confirm logic here (e.g., save the changes)
|
||||||
|
show.value = false // Close the dialog
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import url('./imageNodeModel.scss');
|
||||||
|
</style>
|
||||||
@ -0,0 +1,14 @@
|
|||||||
|
/*
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2025-07-23 16:19:16
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2025-07-23 16:37:17
|
||||||
|
* @FilePath: \Robot-Al-Platform-Web\src\renderer\src\views\Design\FlowImagesCapture\index.ts
|
||||||
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||||
|
*/
|
||||||
|
import imageNodeModel from './imageNodeModel.vue'
|
||||||
|
import multiImageNodeModel from './multiImageNodeModel.vue'
|
||||||
|
|
||||||
|
export const FlowImageNodeModel = imageNodeModel
|
||||||
|
|
||||||
|
export const FlowMultiImageNodeModel = multiImageNodeModel
|
||||||
@ -0,0 +1,40 @@
|
|||||||
|
/* 弹框整体样式 */
|
||||||
|
.controllerManagement-container {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 766px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.controllerManagement-content {
|
||||||
|
flex: 1;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px 24px 24px;
|
||||||
|
|
||||||
|
.form-device-btn {
|
||||||
|
width: 80px;
|
||||||
|
padding: 0 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-table {
|
||||||
|
.customList-table {
|
||||||
|
width: 100%;
|
||||||
|
height: 190px;
|
||||||
|
background: #363940;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-add-btn {
|
||||||
|
/* 按钮样式 */
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 128px;
|
||||||
|
height: 40px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue