automas_admin/AUTO-MAS-test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(Queue, Scripts): 修改脚本页面的空状态

Browse Source
This commit is contained in:
AoXuan
2025-09-02 12:45:44 +08:00
parent 0162e1a9b7
commit a40fa37bfd
2 changed files with 45 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/views/Queue.vue
View File

@@ -10,7 +10,6 @@
<div class="queue-header">
<div class="header-left">
<h1 class="page-title">调度队列</h1>
<p class="page-description">管理您的自动化调度队列和任务配置</p>
</div>
<div class="header-actions">
<a-space size="middle">

76
frontend/src/views/Scripts.vue
View File

@@ -5,37 +5,58 @@
</div>
<!-- 主要内容 -->
<div class="scripts-header">
<div class="header-title">
<h1>脚本管理</h1>
</div>
<a-space size="middle">
<a-button type="primary" size="large" @click="handleAddScript" class="link">
<template #icon>
<PlusOutlined />
</template>
新建脚本
</a-button>
<a-button size="large" @click="handleRefresh" class="default">
<template #icon>
<ReloadOutlined />
</template>
刷新
</a-button>
</a-space>
<div class="scripts-header">
<div class="header-title">
<h1>脚本管理</h1>
</div>
<!-- 如果没有脚本，显示占位符 -->
<div v-if="scripts.length === 0" class="placeholder-container">
<div class="placeholder-content">
<h2>当前没有脚本</h2>
<p>您还没有创建任何脚本，点击下方的“新建脚本”按钮来创建您的第一个脚本。</p>
<a-space size="middle">
<a-button type="primary" size="large" @click="handleAddScript" class="link">
<template #icon>
<PlusOutlined />
</template>
新建脚本
</a-button>
<a-button size="large" @click="handleRefresh" class="default">
<template #icon>
<ReloadOutlined />
</template>
刷新
</a-button>
</a-space>
</div>
<!-- &lt;!&ndash; 如果没有脚本，显示占位符 &ndash;&gt;-->
<!-- <div v-if="scripts.length === 0" class="placeholder-container">-->
<!-- <div class="placeholder-content">-->
<!-- <h2>当前没有脚本</h2>-->
<!-- <p>您还没有创建任何脚本，点击下方的“新建脚本”按钮来创建您的第一个脚本。</p>-->
<!-- <a-button type="primary" size="large" @click="handleAddScript">-->
<!-- <template #icon>-->
<!-- <PlusOutlined />-->
<!-- </template>-->
<!-- 新建脚本-->
<!-- </a-button>-->
<!-- </div>-->
<!-- </div>-->
<!-- 空状态 -->
<div v-if="scripts.length === 0" class="empty-state">
<a-empty
image="https://gw.alipayobjects.com/zos/antfincdn/ZHrcdLPrvN/empty.svg"
:image-style="{ height: '120px' }"
description="当前没有脚本"
>
<template #description>
<span class="empty-description">
您还没有创建任何脚本，点击下方的“新建脚本”按钮来创建您的第一个脚本。
</span>
</template>
<a-button type="primary" size="large" @click="handleAddScript">
<template #icon>
<PlusOutlined />
</template>
新建脚本
</a-button>
</div>
</a-empty>
</div>
<ScriptTable
@@ -700,7 +721,6 @@ const handleToggleUserStatus = async (user: User) => {
overflow: hidden;
}
.type-radio-group :deep(.ant-radio-button-wrapper-checked) {
border-color: var(--ant-color-primary);
background: var(--ant-color-primary-bg);
@@ -799,7 +819,6 @@ const handleToggleUserStatus = async (user: User) => {
overflow: hidden;
}
.mode-radio-group :deep(.ant-radio-button-wrapper-checked) {
border-color: var(--ant-color-primary);
background: var(--ant-color-primary-bg);
@@ -821,7 +840,6 @@ const handleToggleUserStatus = async (user: User) => {
transition: all 0.3s ease;
}
/* 模板选择弹窗样式 */
.template-select-modal :deep(.ant-modal-content) {
border-radius: 20px;
@@ -870,7 +888,6 @@ const handleToggleUserStatus = async (user: User) => {
background: var(--ant-color-bg-container);
}
.template-item.selected {
border-color: var(--ant-color-primary);
background: var(--ant-color-primary-bg);
@@ -992,7 +1009,6 @@ const handleToggleUserStatus = async (user: User) => {
0 1px 3px rgba(0, 0, 0, 0.4);
}
.add-button {
box-shadow: 0 4px 12px rgba(24, 144, 255, 0.4);
}
@@ -1160,7 +1176,6 @@ const handleToggleUserStatus = async (user: User) => {
transition: all 0.2s ease;
}
.template-item.selected {
border-color: var(--ant-color-primary);
background: var(--ant-color-primary-bg);
@@ -1177,7 +1192,6 @@ const handleToggleUserStatus = async (user: User) => {
position: relative;
}
.template-icon-wrapper::before {
content: '';
position: absolute;