itcsx/Docker
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ow

Browse Source
This commit is contained in:
owenchen committed 2026-09-23 16:32:57 +08:00
1 parent 0814ec40a2
commit 70e1c729ae
5 files changed
+140 -235
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

WebVue/src/components/basic/OperatorStation.vue
+16 -13
View File
@@ -14,18 +14,25 @@
<a-tooltip title="上传文件">
<a-button v-if="canCreate" :icon="h(UploadOutlined)" type="primary" class="nav-btn"
@click="triggerUpload">
</a-button> </a-tooltip></a-col>
<a-col flex="32px" v-if="!isDirectorySelected && isSingleItem">
<a-tooltip title="下载">
<a-button class="nav-btn" :icon="h(DownloadOutlined)" :disabled="!canAmend"
@click="onDownload"></a-button>
</a-tooltip>
</a-button> </a-tooltip>
</a-col>
<a-col flex="32px" v-if="!isDirectorySelected && (isSingleItem || isSameMediaTypeSelected)">
<a-tooltip title="共享">
<a-button class="nav-btn" :icon="h(ShareAltOutlined)" @click="onShare"></a-button>
</a-tooltip>
</a-col>
<a-col flex="32px" v-if="!isDirectorySelected && (isSingleItem || isSameMediaTypeSelected)">
<a-tooltip :title="publishTooltip">
<a-button class="nav-btn" :icon="h(NotificationOutlined)" @click="onPublish"></a-button>
</a-tooltip>
</a-col>
<a-col flex="32px" v-if="!isDirectorySelected && isSingleItem">
<a-tooltip title="下载">
<a-button class="nav-btn" :icon="h(DownloadOutlined)" :disabled="!canAmend"
@click="onDownload"></a-button>
</a-tooltip>
</a-col>
<a-col flex="32px" v-if="isSingleItem">
<a-tooltip title="重命名">
<a-button class="nav-btn" :icon="h(EditOutlined)" :disabled="!canAmend"
@@ -46,11 +53,6 @@
</a-popconfirm>
</a-tooltip>
</a-col>
<a-col flex="32px" v-if="!isDirectorySelected && (isSingleItem || isSameMediaTypeSelected)">
<a-tooltip :title="publishTooltip">
<a-button class="nav-btn" :icon="h(NotificationOutlined)" @click="onPublish"></a-button>
</a-tooltip>
</a-col>
<a-col flex="32px" v-if="!isDirectorySelected && isSingleItem">
<a-tooltip :title="previewTooltip">
<a-button class="nav-btn" @click="onViewPreview"><cust-icon-font size="16"
@@ -302,7 +304,8 @@ const onContinueAudio = () => {
原来是靠 24 栅格 span=2 撑开的，间距会随容器宽度变化（400px 时只有 1px 左右），
现在按钮列固定 32px（与 .nav-btn 同宽），真正的间距交给 gap：8px */
.ops-row {
gap: 8px;
gap: 4px;
margin-top: 4px;
flex-wrap: nowrap;
}
@@ -312,7 +315,7 @@ const onContinueAudio = () => {
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
border-radius: 4px;
}
.nav-btn:hover:not(:disabled) {
WebVue/src/components/basic/OperatorStationDelete.vue
+16 -14
View File
@@ -2,22 +2,22 @@
<a-row :wrap="false">
<a-col flex="auto">
<a-row>
<a-col flex="300px">
<a-col flex="400px">
<a-row justify="start" class="ops-row">
<a-col flex="28px" style="margin-left: 8px">
<a-col flex="32px" style="margin-left: 8px">
<a-tooltip title="还原">
<a-button class="nav-btn" :icon="h(UndoOutlined)" style="color:green;"
:disabled="!hasSelection" @click="$emit('restore', selectedItems)"></a-button>
</a-tooltip>
</a-col>
<a-col flex="28px">
<a-col flex="32px">
<a-tooltip title="下载">
<a-button class="nav-btn" :icon="h(DownloadOutlined)"
:disabled="!hasSelection || isDirectorySelected || !isSingleItem"
@click="onDownload"></a-button>
</a-tooltip>
</a-col>
<a-col flex="28px" v-if="hasSelection">
<a-col flex="32px" v-if="hasSelection">
<a-tooltip title="删除">
<a-popconfirm title="确定是否删除?" ok-text="是" cancel-text="否"
@confirm="$emit('delete', selectedItems)">
@@ -25,13 +25,13 @@
:disabled="!canCreate"></a-button></a-popconfirm>
</a-tooltip>
</a-col>
<a-col flex="28px" v-if="!isDirectorySelected && isSingleItem && isSingleVideo">
<a-col flex="32px" v-if="!isDirectorySelected && isSingleItem && isSingleVideo">
<a-tooltip>
<a-button class="nav-btn" @click="onPlayVideo"><cust-icon-font size="16"
type="icon-foldervideo" /></a-button>
</a-tooltip>
</a-col>
<a-col flex="28px" v-if="!isDirectorySelected && isSingleItem && isSingleAudio">
<a-col flex="32px" v-if="!isDirectorySelected && isSingleItem && isSingleAudio">
<a-tooltip v-if="selectedItem.IsPlay != 'Y'">
<a-button class="nav-btn" :icon="h(PlayCircleOutlined, { style: { color: 'red' } })"
@click="onPlayAudio"></a-button>
@@ -188,17 +188,19 @@ const onContinueAudio = () => {
原来是靠 24 栅格 span=3 撑开的，间距会随容器宽度变化，
现在按钮列固定 28px（与 .nav-btn 同宽），真正的间距交给 gap */
.ops-row {
gap: 8px;
flex-wrap: nowrap;
gap: 4px;
margin-top: 4px;
flex-wrap: nowrap;
}
.nav-btn {
width: 28px;
height: 26px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
}
.nav-btn:hover:not(:disabled) {
WebVue/src/components/basic/OperatorStationFamily.vue
+3 -2
View File
@@ -2,7 +2,7 @@
<a-row :wrap="false">
<a-col flex="auto">
<a-row>
<a-col flex="300px">
<a-col flex="400px">
<a-row justify="start" class="ops-row">
<a-col flex="32px" style="margin-left: 8px">
<a-tooltip title="新建文件夹">
@@ -215,7 +215,8 @@ const onContinueAudio = () => {
原来是靠 24 栅格 span=3 撑开的，间距会随容器宽度变化，
现在按钮列固定 32px，真正的间距交给 gap */
.ops-row {
gap: 8px;
gap: 4px;
margin-top: 4px;
flex-wrap: nowrap;
}
WebVue/src/components/basic/Toolbar.vue
+64 -128
View File
@@ -2,183 +2,109 @@
<a-row :wrap="false">
<a-col flex="auto">
<a-row>
<a-col flex="100px">
<a-row justify="start">
<a-col :span="8"
><a-tooltip title="返回顶层">
<a-button
type="text"
class="nav-btn"
:disabled="!canGoTop"
@click="$emit('go-top')"
>
<a-col>
<a-row justify="start" class="ops-row" style="margin-left: 8px">
<a-col :span="8"><a-tooltip title="返回顶层">
<a-button class="nav-btn" :disabled="!canGoTop" @click="$emit('go-top')">
<HomeOutlined />
</a-button> </a-tooltip
></a-col>
<a-col :span="8"
><a-tooltip title="返回上层">
<a-button
type="text"
class="nav-btn"
:disabled="!canGoBack"
@click="$emit('go-back')"
>
</a-button> </a-tooltip></a-col>
<a-col :span="8"><a-tooltip title="返回上层">
<a-button class="nav-btn" :disabled="!canGoBack" @click="$emit('go-back')">
<ArrowLeftOutlined />
</a-button> </a-tooltip
></a-col>
<a-col :span="8"
><a-tooltip title="刷新">
<a-button
type="text"
class="nav-btn"
:loading="loading"
@click="onRefresh"
>
</a-button> </a-tooltip></a-col>
<a-col :span="8"><a-tooltip title="刷新">
<a-button class="nav-btn" :loading="loading" @click="onRefresh">
<ReloadOutlined />
</a-button> </a-tooltip
></a-col>
</a-button> </a-tooltip></a-col>
</a-row>
</a-col>
<a-col :xs="0" :sm="0" :lg="20" flex="auto">
<div
class="toolbar-center"
style="margin-top: 5px; margin-left: 10px"
>
<div class="toolbar-center" style="margin-top: 5px; margin-left: 10px">
<a-breadcrumb class="breadcrumb">
<a-breadcrumb-item
v-for="(item, index) in breadcrumbItems"
:key="index"
@click="onBreadcrumbClick(item, index)"
:class="{ clickable: index < breadcrumbItems.length - 1 }"
>
<a-breadcrumb-item v-for="(item, index) in breadcrumbItems" :key="index"
@click="onBreadcrumbClick(item, index)" :class="{ clickable: index < breadcrumbItems.length - 1 }">
<template v-if="index === 0">
<LaptopOutlined style="margin-right: 4px" />
</template>
<template v-else>
<FolderOutlined style="margin-right: 4px" />
</template>
<span
:style="{
cursor:
index < breadcrumbItems.length - 1
? 'pointer'
: 'default',
color: index < breadcrumbItems.length - 1 ? '#1677ff' : '',
}"
>{{ item.displayName }}</span
>
<span :style="{
cursor:
index < breadcrumbItems.length - 1
? 'pointer'
: 'default',
color: index < breadcrumbItems.length - 1 ? '#1677ff' : '',
}">{{ item.displayName }}</span>
</a-breadcrumb-item>
</a-breadcrumb>
</div>
</a-col>
<a-col :xs="10" :sm="10" :lg="0" flex="auto">
<div
v-if="viewMode == 'list'"
style="
<a-col :xs="20" :sm="20" :lg="0" flex="auto" :style="viewMode === 'list' ? {
border: '1px solid #e5e5e5',
borderLeft: 'none',
borderRight: 'none'
} : {}">
<div v-if="viewMode == 'list'" style="
margin-top: 8px;
margin-left: 10px;
display: flex;
align-items: center;
"
>
">
<FolderOutlined style="margin-right: 4px" />
<span class="breadcrumb-text">{{
<span @click="viewMode = 'search'" class="breadcrumb-text">{{
breadcrumbItems.length > 0
? breadcrumbItems[breadcrumbItems.length - 1].displayName
: ""
}}</span>
</div>
<div
style="
<div style="
max-width: 260px;
min-width: 220px;
margin-left: 20px;
margin-top: -2px;
display: flex;
justify-content: center;
margin-left:6px;
gap: 4px;
"
v-else
>
<a-input-search
v-model:value="searchKeyword"
placeholder="搜索文件名称"
allow-clear
@search="onSearch"
@pressEnter="onSearch"
>
" v-else>
<a-input-search v-model:value="searchKeyword" placeholder="搜索文件名称" allow-clear @search="onSearch"
@pressEnter="onSearch">
</a-input-search>
<a-button size="small" type="default" @click="viewMode = 'list'" style="height: 32px;">
<cust-icon-font size="32" type="icon-gongcheng" />
</a-button>
<!-- <a-button size="small" type="default" @click="viewMode = 'list'" style="height: 32px;">
<cust-icon-font size="32" type="icon-gongcheng" />
</a-button> -->
</div>
</a-col> </a-row
></a-col>
</a-col>
</a-row>
</a-col>
<a-col :xs="0" :sm="0" :lg="10" flex="none">
<div style="margin-bottom: 8px; margin-right: 8px">
<a-input-search
v-model:value="searchKeyword"
placeholder="搜索文件名称"
allow-clear
@search="onSearch"
@pressEnter="onSearch"
>
<a-input-search v-model:value="searchKeyword" placeholder="搜索文件名称" allow-clear @search="onSearch"
@pressEnter="onSearch">
</a-input-search>
</div>
</a-col>
<a-col :xs="4" :sm="4" :lg="0" flex="none">
<div
v-if="viewMode == 'list'"
style="
<div v-if="viewMode == 'list'" style="
margin-right: 20px;
display: flex;
justify-content: center;
gap: 8px;
"
>
<a-button size="small" type="default" @click="viewMode = 'search'">
gap: 2px;
">
<a-button class="nav-btn" @click="viewMode = 'search'">
<cust-icon-font size="14" type="icon-sousuo" />
</a-button>
<a-button
size="small"
type="default"
title="使用帮助"
@click="helpVisible = true"
>
<!-- <a-button size="small" type="default" title="使用帮助" @click="helpVisible = true">
<cust-icon-font size="14" type="icon-help" />
</a-button>
</a-button> -->
</div>
</a-col>
<a-col :xs="0" :sm="0" :lg="1" flex="none">
<div
v-if="viewMode == 'list'"
style="
margin-right: 20px;
display: flex;
justify-content: center;
gap: 8px;
"
>
<a-button
style="height: 32px"
size="small"
type="default"
title="使用帮助"
@click="helpVisible = true"
>
<cust-icon-font size="16" type="icon-help" />
</a-button>
</div>
</a-col>
<!-- 使用帮助弹窗：内容默认取「我的云盘」页面说明，父组件可用 #help 插槽覆盖 -->
<!-- 宽度不写死：跟随 DragModal 的默认宽度（视口 90%） -->
<dragModal
v-model:open="helpVisible"
title="我的云盘 · 使用帮助"
:footer="null"
:fullscreen="width < 640"
>
<dragModal v-model:open="helpVisible" title="我的云盘 · 使用帮助" :footer="null" :fullscreen="width < 640">
<slot name="help">
<DmsFileEnquiryHelp />
</slot>
@@ -254,6 +180,7 @@ const onBreadcrumbClick = (item: BreadcrumbItem, index: number) => {
* 不能取第一个节点，否则会把路径截回到根目录，变成跳转而不是刷新。
*/
const onRefresh = () => {
viewMode.value = 'list';
const lastIndex = breadcrumbItems.value.length - 1;
if (lastIndex < 0) return;
onBreadcrumbClick(breadcrumbItems.value[lastIndex], lastIndex);
@@ -261,13 +188,21 @@ const onRefresh = () => {
</script>
<style lang="less">
/* 按钮之间统一 8px 间距。
原来是靠 24 栅格 span=2 撑开的，间距会随容器宽度变化（400px 时只有 1px 左右），
现在按钮列固定 32px（与 .nav-btn 同宽），真正的间距交给 gap：8px */
.ops-row {
gap: 2px;
flex-wrap: nowrap;
}
.nav-btn {
width: 36px;
height: 36px;
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
border-radius: 4px;
}
.nav-btn:hover:not(:disabled) {
@@ -303,7 +238,8 @@ const onRefresh = () => {
.breadcrumb-text {
display: inline-block;
max-width: 16ch; /* 6个字符宽度，ch 按字符计算 */
max-width: 16ch;
/* 6个字符宽度，ch 按字符计算 */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
WebVue/src/layout/index.vue
+41 -78
View File
@@ -1,108 +1,71 @@
<template>
<a-layout class="layout" has-sider>
<a-layout-sider
:collapsed-width="collapsedWidth"
class="layout-sider"
theme="light"
:width="sideBarWidth"
:style="{
overflow: 'auto',
height: '100vh',
position: 'fixed',
left: 0,
top: 0,
bottom: 0,
'z-index': 1000,
'box-shadow': '0px 0px 10px rgba(0, 0, 0, 0.9)',
}"
v-model:collapsed="collapsed"
collapsible
>
<a-layout-sider :collapsed-width="collapsedWidth" class="layout-sider" theme="light" :width="sideBarWidth" :style="{
overflow: 'auto',
height: '100vh',
position: 'fixed',
left: 0,
top: 0,
bottom: 0,
'z-index': 1000,
'box-shadow': '0px 0px 10px rgba(0, 0, 0, 0.9)',
}" v-model:collapsed="collapsed" collapsible>
<div class="logo" />
<a-menu
class="layout-menu"
v-model:selectedKeys="selectedMenuKeys"
mode="inline"
@click="handleClick"
:items="menuItems"
/>
<a-menu class="layout-menu" v-model:selectedKeys="selectedMenuKeys" mode="inline" @click="handleClick"
:items="menuItems" />
</a-layout-sider>
<a-layout
:style="{
marginLeft: sideBarWidth,
height: '100vh',
transition: 'margin-left 200ms',
}"
class="layout-main"
>
<a-layout :style="{
marginLeft: sideBarWidth,
height: '100vh',
transition: 'margin-left 200ms',
}" class="layout-main">
<a-layout-header class="layout-header">
<a-tooltip :title="t('layout.header.backToDashboard')" placement="bottomLeft">
<div class="layout-header-left" @click="onpush()">
<a-avatar shape="square" size="large" src="/youjia.svg" />
<a-page-header style="padding-left: 4px" :title="compnentTitle" />
<a-page-header style="padding-left: 4px" :title="compnentTitle"> </a-page-header>
</div>
</a-tooltip>
<a-menu
mode="horizontal"
v-model:selectedKeys="selectedHeaderKeys"
:items="headerItems"
breakpoint="lg"
@click="headerHandleClick"
/>
<a-menu mode="horizontal" v-model:selectedKeys="selectedHeaderKeys" :items="headerItems" breakpoint="lg"
@click="headerHandleClick" />
</a-layout-header>
<a-config-provider :locale="locale === 'en' ? enUS : zhCN">
<a-layout-content class="layout-content">
<div class="layout-page-header">
<MenuUnfoldOutlined
:style="{ fontSize: '22px', color: '#08c' }"
@click="collapsedHandle"
v-if="collapsed"
/>
<MenuFoldOutlined
:style="{ fontSize: '22px', color: '#08c' }"
@click="collapsedHandle"
v-if="!collapsed"
/>
<a-page-header
style="
<MenuUnfoldOutlined :style="{ fontSize: '22px', color: '#08c' }" @click="collapsedHandle"
v-if="collapsed" />
<MenuFoldOutlined :style="{ fontSize: '22px', color: '#08c' }" @click="collapsedHandle" v-if="!collapsed" />
<a-page-header style="
border: 0px none rgb(235, 237, 240);
padding: 0;
padding-left: 8px;
"
:title="titleHeader"
/>
" :title="titleHeader" />
<!-- 常驻可见的首页入口：手机端没有 hover，提示必须一直显示在那里才有用。
已经在首页时不显示，避免点了没反应。 -->
<a-button
<!-- <a-button
v-if="!isWelcome"
type="link"
class="home-entry"
class="home-entry nav-btn"
@click="onpush()"
>
<template #icon><DashboardOutlined /></template>
{{ t("layout.header.backToDashboard") }}
</a-button>
</a-button> -->
</div>
<div
class="layout-content-view"
:style="{
height:
bsInfo.height -
(bsInfo.size.sm || !isWelcome ? 100 : 140) +
'px',
}"
>
<div class="layout-content-view" :style="{
height:
bsInfo.height -
(bsInfo.size.sm || !isWelcome ? 100 : 140) +
'px',
}">
<router-view />
</div>
</a-layout-content>
<changePassword v-model:showModel="showChangePassword" />
<changeLocalName v-model:showModel="showChangeUserLocalName" />
<changeLocalName v-model:showModel="showChangeUserLocalName" />
<changeBiometricEnrollCard v-model:showModel="showBiometricEnroll" />
</a-config-provider>
<a-layout-footer
v-if="!bsInfo.size.sm && isWelcome"
class="layout-footer"
>
<a-layout-footer v-if="!bsInfo.size.sm && isWelcome" class="layout-footer">
<div>{{ copy }}</div>
<div>
<a href="https://beian.miit.gov.cn/">{{ beian }}</a>
@@ -565,7 +528,7 @@ const headerHandleClick: MenuProps["onClick"] = (menuInfo) => {
} else if (menuInfo.key == "amentPassword") {
showChangePassword.value = true;
} else if (menuInfo.key == "biometricButton") {
showBiometricEnroll.value=true;
showBiometricEnroll.value = true;
} else if (menuInfo.key == "amentUserLocalName") {
showChangeUserLocalName.value = true;
} else if (menuInfo.key == "chinese") {
@@ -643,8 +606,7 @@ provide(layoutProviderMethodKey, {
height: calc(100vh - 48px);
}
.layout-main {
}
.layout-main {}
.layout-header {
background-color: white;
@@ -686,10 +648,11 @@ provide(layoutProviderMethodKey, {
flex: none;
align-self: center;
margin-left: auto;
margin-right: 8px;
margin-right: 12px;
padding-inline: 4px;
}
.layout-page-header .ant-page-header-heading {
//background-color: silver;
padding: 0;