feat(dev): 添加开发模式专用指令和配置支持

- 在 config.json 中新增 dev 配置项用于区分开发与生产环境
- 实现 v-dev-only 指令,仅在开发模式下渲染元素
- 注册全局自定义指令 dev-only,支持通过 binding.value 控制启用状态
- 在 TaskSyllabus/Bg.vue 中使用 v-dev-only 指令隐藏生产环境下的加号区域
- 移除 card 样式中的固定 margin-bottom,改由容器控制间距
- 统一使用 CSS 变量 --color-border-separate 替代硬编码的分割线颜色
- 为 Task.vue 的搜索框添加 clearable 属性并移除弹出项的阴影效果
- Layout 组件名称规范化为首字母大写
- 在主题样式中定义深色与浅色模式下的 --color-border-separate 颜色值
- 覆盖 Element Plus 的 --el-fill-color-blank 以适配暗黑模式背景透明度需求
This commit is contained in:
zhaoweijie
2025-12-21 18:10:37 +08:00
parent f0db3c88e4
commit cc22655a1e
10 changed files with 70 additions and 6 deletions

View File

@@ -144,6 +144,7 @@ onMounted(() => {
@change="agentsStore.setSearchValue"
:disabled="!(agentsStore.agents.length > 0)"
:debounce="0"
:clearable="true"
:trigger-on-focus="triggerOnFocus"
@focus="handleFocus"
@blur="handleBlur"
@@ -228,6 +229,7 @@ onMounted(() => {
transition: height 0s ease-in-out;
border-top: 1px solid var(--color-border);
border-radius: 0;
box-shadow: none;
li {
height: 45px;

View File

@@ -27,6 +27,7 @@ defineEmits<{
<!-- 顶部加号区域 -->
<div
v-if="!isAdding"
v-dev-only
class="plus-area mt-[35px] ml-[-15px] w-[34px] h-[34px] flex items-center justify-center cursor-pointer rounded-full"
@click="$emit('start-add-output')"
>

View File

@@ -278,7 +278,7 @@ defineExpose({
<div
v-for="item in collaborationProcess"
:key="item.Id"
class="card-it w-full flex items-center gap-[14%] bg-[var(--color-card-bg)]"
class="card-it w-full flex items-center gap-[14%] bg-[var(--color-card-bg)] mb-[100px]"
>
<!-- 流程卡片 -->
<el-card
@@ -291,7 +291,7 @@ defineExpose({
<MultiLineTooltip placement="right" :text="item.StepName" :lines="2">
<div class="text-[18px] font-bold text-center">{{ item.StepName }}</div>
</MultiLineTooltip>
<div class="h-[1px] w-full bg-[#d6d6d6] my-[8px]"></div>
<div class="h-[1px] w-full bg-[var(--color-border-separate)] my-[8px]"></div>
<!-- 任务内容区域 - 支持双击编辑 -->
<div v-if="editingTaskId === item.Id" class="w-full">
@@ -321,7 +321,7 @@ defineExpose({
</MultiLineTooltip>
</div>
<div class="h-[1px] w-full bg-[#d6d6d6] my-[8px]"></div>
<div class="h-[1px] w-full bg-[var(--color-border-separate)] my-[8px]"></div>
<div
class="flex items-center gap-2 overflow-y-auto flex-wrap relative w-full max-h-[72px]"
>
@@ -384,7 +384,6 @@ defineExpose({
border: 1px solid var(--color-card-border-task);
box-sizing: border-box;
transition: border-color 0.2s ease;
margin-bottom: 100px;
&:hover {
background-color: var(--color-card-bg-task-hover);
border-color: var(--color-card-border-hover);