oneos-v5/frontend
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

feat: style

Browse Source
This commit is contained in:
xingyu4j
2025-06-17 20:22:24 +08:00
parent 7276d0a909
commit a4f4c0d6f6
162 changed files with 689 additions and 796 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web-antd/src/components/simple-process-design/components/nodes-config/condition-node-config.vue
View File

@@ -158,7 +158,7 @@ function changeNodeName() {
defineExpose({ open }); // 提供 open 方法，用于打开弹窗
</script>
<template>
<Drawer class="w-[580px]">
<Drawer class="w-1/3">
<template #title>
<div class="flex items-center">
<Input

15
apps/web-antd/src/components/simple-process-design/components/nodes-config/copy-task-node-config.vue
View File

@@ -207,14 +207,14 @@ onMounted(() => {
defineExpose({ showCopyTaskNodeConfig }); // 暴露方法给父组件
</script>
<template>
<Drawer class="w-[580px]">
<Drawer class="w-1/3">
<template #title>
<div class="config-header">
<Input
v-if="showInput"
ref="inputRef"
type="text"
class="config-editable-input"
class="focus:border-blue-500 focus:shadow-[0_0_0_2px_rgba(24,144,255,0.2)] focus:outline-none"
@blur="changeNodeName()"
@press-enter="changeNodeName()"
v-model:value="nodeName"
@@ -446,7 +446,7 @@ defineExpose({ showCopyTaskNodeConfig }); // 暴露方法给父组件
v-if="formType === BpmModelFormType.NORMAL"
>
<div class="p-1">
<div class="mb-4 text-[16px] font-bold">字段权限</div>
<div class="mb-4 text-base font-bold">字段权限</div>
<!-- 表头 -->
<Row class="border border-gray-200 px-4 py-3">
@@ -522,12 +522,3 @@ defineExpose({ showCopyTaskNodeConfig }); // 暴露方法给父组件
</Tabs>
</Drawer>
</template>
<style lang="scss" scoped>
.config-editable-input {
&:focus {
outline: 0;
border-color: #40a9ff;
box-shadow: 0 0 0 2px rgb(24 144 255 / 20%);
}
}
</style>

2
apps/web-antd/src/components/simple-process-design/components/nodes-config/delay-timer-node-config.vue
View File

@@ -152,7 +152,7 @@ function openDrawer(node: SimpleFlowNode) {
defineExpose({ openDrawer }); // 暴露方法给父组件
</script>
<template>
<Drawer class="w-[480px]">
<Drawer class="w-1/3">
<template #title>
<div class="flex items-center">
<Input

8
apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/condition.vue
View File

@@ -178,7 +178,7 @@ defineExpose({ validate });
{{ condition.conditionGroups.and ? '且' : '或' }}
</template>
<Card
class="group relative w-full hover:border-[#1890ff]"
class="group relative w-full hover:border-blue-500"
v-for="(equation, cIdx) in condition.conditionGroups.conditions"
:key="cIdx"
>
@@ -187,7 +187,7 @@ defineExpose({ validate });
v-if="condition.conditionGroups.conditions.length > 1"
>
<IconifyIcon
color="#0089ff"
color="blue"
icon="lucide:circle-x"
class="size-4"
@click="
@@ -290,7 +290,7 @@ defineExpose({ validate });
</FormItem>
</Col>
<Col :span="3">
<div class="flex h-[32px] items-center">
<div class="flex h-8 items-center">
<Trash2
v-if="equation.rules.length > 1"
class="mr-2 size-4 cursor-pointer text-red-500"
@@ -307,7 +307,7 @@ defineExpose({ validate });
</Space>
<div title="添加条件组" class="mt-4 cursor-pointer">
<Plus
class="size-[24px] text-blue-500"
class="size-6 text-blue-500"
@click="addConditionGroup(condition.conditionGroups?.conditions)"
/>
</div>

16
apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/http-request-param-setting.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import type { HttpRequestParam } from '../../../consts';
import { Plus, Trash2 } from '@vben/icons';
import { IconifyIcon } from '@vben/icons';
import {
Button,
@@ -121,9 +121,10 @@ function deleteHttpRequestParam(arr: HttpRequestParam[], index: number) {
</FormItem>
</Col>
<Col :span="2">
<div class="flex h-[32px] items-center">
<Trash2
<div class="flex h-8 items-center">
<IconifyIcon
class="size-4 cursor-pointer text-red-500"
icon="lucide:trash-2"
@click="deleteHttpRequestParam(props.header, index)"
/>
</div>
@@ -135,7 +136,7 @@ function deleteHttpRequestParam(arr: HttpRequestParam[], index: number) {
class="flex items-center"
>
<template #icon>
<Plus class="size-[18px]" />
<IconifyIcon class="size-4" icon="lucide:plus" />
</template>
添加一行
</Button>
@@ -205,9 +206,10 @@ function deleteHttpRequestParam(arr: HttpRequestParam[], index: number) {
</FormItem>
</Col>
<Col :span="2">
<div class="flex h-[32px] items-center">
<Trash2
<div class="flex h-8 items-center">
<IconifyIcon
class="size-4 cursor-pointer text-red-500"
icon="lucide:trash-2"
@click="deleteHttpRequestParam(props.body, index)"
/>
</div>
@@ -219,7 +221,7 @@ function deleteHttpRequestParam(arr: HttpRequestParam[], index: number) {
class="flex items-center"
>
<template #icon>
<Plus class="size-[18px]" />
<IconifyIcon class="size-4" icon="lucide:plus" />
</template>
添加一行
</Button>

9
apps/web-antd/src/components/simple-process-design/components/nodes-config/modules/http-request-setting.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { toRefs, watch } from 'vue';
import { Plus, Trash2 } from '@vben/icons';
import { IconifyIcon } from '@vben/icons';
import {
Alert,
@@ -153,9 +153,10 @@ function deleteHttpResponseSetting(
</FormItem>
</Col>
<Col :span="2">
<div class="flex h-[32px] items-center">
<Trash2
<div class="flex h-8 items-center">
<IconifyIcon
class="size-4 cursor-pointer text-red-500"
icon="lucide:trash-2"
@click="deleteHttpResponseSetting(setting.response!, index)"
/>
</div>
@@ -167,7 +168,7 @@ function deleteHttpResponseSetting(
class="flex items-center"
>
<template #icon>
<Plus class="size-[18px]" />
<IconifyIcon class="size-4" icon="lucide:plus" />
</template>
添加一行
</Button>

4
apps/web-antd/src/components/simple-process-design/components/nodes-config/router-node-config.vue
View File

@@ -200,7 +200,7 @@ function getRouterNode(node: any) {
defineExpose({ openDrawer }); // 暴露方法给父组件
</script>
<template>
<Drawer class="w-[40%]">
<Drawer class="w-2/5">
<template #title>
<div class="flex items-center">
<Input
@@ -236,7 +236,7 @@ defineExpose({ openDrawer }); // 暴露方法给父组件
<div class="flex items-center font-normal">
<span class="font-medium">路由{{ index + 1 }}</span>
<FormItem
class="mb-0 ml-4 inline-block w-[180px]"
class="mb-0 ml-4 inline-block w-48"
:name="['routerGroups', index, 'nodeId']"
:rules="{
required: true,

4
apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue
View File

@@ -148,7 +148,7 @@ defineExpose({ showStartUserNodeConfig });
ref="inputRef"
v-if="showInput"
type="text"
class="config-editable-input"
class="focus:border-blue-500 focus:shadow-[0_0_0_2px_rgba(24,144,255,0.2)] focus:outline-none"
@blur="changeNodeName()"
@press-enter="changeNodeName()"
v-model:value="nodeName"
@@ -214,7 +214,7 @@ defineExpose({ showStartUserNodeConfig });
v-if="formType === BpmModelFormType.NORMAL"
>
<div class="p-1">
<div class="mb-4 text-[16px] font-bold">字段权限</div>
<div class="mb-4 text-base font-bold">字段权限</div>
<!-- 表头 -->
<Row class="border border-gray-200 px-4 py-3">

20
apps/web-antd/src/components/simple-process-design/components/nodes-config/trigger-node-config.vue
View File

@@ -11,7 +11,7 @@ import type {
import { computed, getCurrentInstance, onMounted, reactive, ref } from 'vue';
import { useVbenDrawer } from '@vben/common-ui';
import { IconifyIcon, Trash2 } from '@vben/icons';
import { IconifyIcon } from '@vben/icons';
import { cloneDeep } from '@vben/utils';
import {
@@ -384,14 +384,14 @@ onMounted(() => {
});
</script>
<template>
<Drawer class="w-[580px]">
<Drawer class="w-1/3">
<template #title>
<div class="config-header">
<Input
ref="inputRef"
v-if="showInput"
type="text"
class="config-editable-input"
class="focus:border-blue-500 focus:shadow-[0_0_0_2px_rgba(24,144,255,0.2)] focus:outline-none"
@blur="changeNodeName()"
@press-enter="changeNodeName()"
v-model:value="nodeName"
@@ -543,9 +543,10 @@ onMounted(() => {
</FormItem>
</Col>
<Col :span="2">
<div class="flex h-[32px] items-center">
<Trash2
<div class="flex h-8 items-center">
<IconifyIcon
class="size-4 cursor-pointer text-red-500"
icon="lucide:trash-2"
@click="deleteFormFieldSetting(formSetting, key)"
/>
</div>
@@ -684,12 +685,3 @@ onMounted(() => {
</div>
</Drawer>
</template>
<style lang="scss" scoped>
.config-editable-input {
&:focus {
outline: 0;
border-color: #40a9ff;
box-shadow: 0 0 0 2px rgb(24 144 255 / 20%);
}
}
</style>

23
apps/web-antd/src/components/simple-process-design/components/nodes-config/user-task-node-config.vue
View File

@@ -580,14 +580,14 @@ onMounted(() => {
});
</script>
<template>
<Drawer class="w-[580px]">
<Drawer class="w-1/3">
<template #title>
<div class="config-header">
<Input
v-if="showInput"
ref="inputRef"
type="text"
class="config-editable-input"
class="focus:border-blue-500 focus:shadow-[0_0_0_2px_rgba(24,144,255,0.2)] focus:outline-none"
@blur="changeNodeName()"
@press-enter="changeNodeName()"
v-model:value="nodeName"
@@ -603,7 +603,7 @@ onMounted(() => {
v-if="currentNode.type === BpmNodeTypeEnum.USER_TASK_NODE"
class="mb-3 flex items-center"
>
<span class="mr-3 text-[16px]">审批类型 :</span>
<span class="mr-3 text-base">审批类型 :</span>
<RadioGroup v-model:value="approveType">
<RadioButton
v-for="(item, index) in APPROVE_TYPE"
@@ -949,7 +949,7 @@ onMounted(() => {
label="超时时间设置"
v-if="configForm.timeoutHandlerEnable"
label-align="left"
class="h-[32px]"
class="h-8"
:label-col="{ span: 6 }"
:wrapper-col="{ span: 18 }"
>
@@ -1105,7 +1105,7 @@ onMounted(() => {
key="buttons"
>
<div class="p-1">
<div class="mb-4 text-[16px] font-bold">操作按钮</div>
<div class="mb-4 text-base font-bold">操作按钮</div>
<!-- 表头 -->
<Row class="border border-gray-200 px-4 py-3">
@@ -1127,7 +1127,7 @@ onMounted(() => {
<Input
v-if="btnDisplayNameEdit[index]"
type="text"
class="input-edit max-w-[130px]"
class="max-w-32 focus:border-blue-500 focus:shadow-[0_0_0_2px_rgba(24,144,255,0.2)] focus:outline-none"
@blur="btnDisplayNameBlurEvent(index)"
v-model:value="item.displayName"
:placeholder="item.displayName"
@@ -1152,7 +1152,7 @@ onMounted(() => {
v-if="formType === BpmModelFormType.NORMAL"
>
<div class="p-1">
<div class="mb-4 text-[16px] font-bold">字段权限</div>
<div class="mb-4 text-base font-bold">字段权限</div>
<!-- 表头 -->
<Row class="border border-gray-200 px-4 py-3">
@@ -1234,12 +1234,3 @@ onMounted(() => {
</Tabs>
</Drawer>
</template>
<style lang="scss" scoped>
.input-edit {
&:focus {
outline: 0;
border-color: #40a9ff;
box-shadow: 0 0 0 2px rgb(24 144 255 / 20%);
}
}
</style>

2
apps/web-antd/src/components/simple-process-design/components/simple-process-designer.vue
View File

@@ -235,7 +235,7 @@ defineExpose({ validate });
:readonly="false"
@save="saveSimpleFlowModel"
/>
<ErrorModal title="流程设计校验不通过" class="w-[40%]">
<ErrorModal title="流程设计校验不通过" class="w-2/5">
<div class="mb-2 text-base">以下节点配置不完善，请修改相关配置</div>
<div
class="mb-3 rounded-md bg-gray-100 p-2 text-sm"

8
apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue
View File

@@ -201,7 +201,7 @@ onMounted(() => {
</script>
<template>
<div class="simple-process-model-container">
<div class="absolute right-[0px] top-[0px] bg-[#fff]">
<div class="absolute right-0 top-0 bg-white">
<Row type="flex" justify="end">
<ButtonGroup key="scale-control">
<Button v-if="!readonly" @click="exportJson">
@@ -216,7 +216,7 @@ onMounted(() => {
type="file"
id="files"
ref="refFile"
style="display: none"
class="hidden"
accept=".json"
@change="importLocalFile"
/>
@@ -226,7 +226,7 @@ onMounted(() => {
<Button :plain="true" @click="zoomOut()">
<IconifyIcon icon="lucide:zoom-out" />
</Button>
<Button class="w-80px"> {{ scaleValue }}% </Button>
<Button class="w-20"> {{ scaleValue }}% </Button>
<Button :plain="true" @click="zoomIn()">
<IconifyIcon icon="lucide:zoom-in" />
</Button>
@@ -258,7 +258,7 @@ onMounted(() => {
>
<div class="mb-2">以下节点内容不完善，请修改后保存</div>
<div
class="b-rounded-1 line-height-normal mb-3 bg-gray-100 p-2"
class="line-height-normal mb-3 rounded bg-gray-100 p-2"
v-for="(item, index) in errorNodes"
:key="index"
>