github
/
dev-sidecar
mirror of https://github.com/docmirror/dev-sidecar
1
0
Fork 0
Code Issues Releases Wiki Activity

optimize: 优化头部样式，避免检索内容后样式变乱了。优化SearchBar样式。

release-2.0.0.2
王良 2025-02-21 15:39:17 +08:00
parent 4c0829cc61
commit c2d24e5713
9 changed files with 63 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
packages/gui/src/view/App.vue
View File

@ -49,22 +49,26 @@ export default {
message = { key: 'show-hide' }
}
if (message.key === 'show-hide') { // 显示/隐藏
this.hideSearchBar = message.hideSearchBar != null ? message.hideSearchBar : !this.hideSearchBar
try {
if (message.key === 'show-hide') { // 显示/隐藏
this.hideSearchBar = message.hideSearchBar != null ? message.hideSearchBar : !this.hideSearchBar
// 显示后，获取输入框焦点
if (!this.hideSearchBar) {
setTimeout(() => {
try {
this.$refs.searchBar.$el.querySelector('input').focus()
} catch {
}
}, 100)
// 显示后，获取输入框焦点
if (!this.hideSearchBar) {
setTimeout(() => {
try {
this.$refs.searchBar.$el.querySelector('input').focus()
} catch {
}
}, 100)
}
} else if (message.key === 'next') { // 下一项
this.$refs.searchBar.next()
} else if (message.key === 'previous') { // 上一项
this.$refs.searchBar.previous()
}
} else if (message.key === 'next') { // 下一项
this.$refs.searchBar.next()
} else if (message.key === 'previous') { // 上一项
this.$refs.searchBar.previous()
} catch (e) {
console.error('操作SearchBar出现异常：', e)
}
})
},
@ -89,6 +93,7 @@ export default {
:highlightClass="'search-bar-highlight'"
:selectedClass="'selected-highlight'"
:hiden.sync="hideSearchBar"
style="top:auto;right:auto;left:160px;bottom:52px;background-color:#ddd"
/>
<a-layout>
<a-layout-sider :theme="theme">
@ -180,9 +185,10 @@ body {
}
.search-bar-highlight {
background-color: #ef0fff;
color: #fdfdfd;
&.selected-highlight {
background-color: #38d878;
background-color: #17a450;
}
}
</style>

3
packages/gui/src/view/components/container.vue
View File

@ -8,7 +8,8 @@ export default {
<div class="ds-container">
<div class="body-wrapper">
<div v-if="$slots.header" class="container-header">
<slot name="header" />
<span><slot name="header" /></span>
<span style="color:#999"><slot name="header-right" /></span>
</div>
<div class="container-body">
<slot />

8
packages/gui/src/view/pages/help.vue
View File

@ -25,10 +25,10 @@ export default {
<ds-container>
<template slot="header">
帮助中心
<span>
<a-button class="md-mr-10" @click="openExternal('https://github.com/docmirror/dev-sidecar/issues/new/choose')">反馈问题</a-button>
<a-button class="md-mr-10" icon="profile" @click="openLog()">查看日志</a-button>
</span>
</template>
<template slot="header-right">
<a-button class="md-mr-10" @click="openExternal('https://github.com/docmirror/dev-sidecar/issues/new/choose')">反馈问题</a-button>
<a-button class="md-mr-10" icon="profile" @click="openLog()">查看日志</a-button>
</template>
<div v-if="config" class="help-list">

26
packages/gui/src/view/pages/index.vue
View File

@ -259,20 +259,20 @@ export default {
<DsContainer class="page_index">
<template slot="header">
给开发者的辅助工具
<span>
<a-button style="margin-right:10px" @click="openSetupCa">
<a-badge :count="_rootCaSetuped ? 0 : 1" dot>安装根证书</a-badge>
</a-button>
</template>
<template slot="header-right">
<a-button style="margin-right:10px" @click="openSetupCa">
<a-badge :count="_rootCaSetuped ? 0 : 1" dot>安装根证书</a-badge>
</a-button>
<a-button
style="margin-right:10px" :loading="update.downloading || update.checking" :title="`当前版本:${info.version}`"
@click="doCheckUpdate(true)"
>
<a-badge :count="update.newVersion ? 1 : 0" dot>
<span v-if="update.downloading">{{ update.progress }}%</span>{{ update.downloading ? '新版本下载中' : (`检查更新${update.checking ? '中' : ''}`) }}
</a-badge>
</a-button>
</span>
<a-button
style="margin-right:10px" :loading="update.downloading || update.checking" :title="`当前版本:${info.version}`"
@click="doCheckUpdate(true)"
>
<a-badge :count="update.newVersion ? 1 : 0" dot>
<span v-if="update.downloading">{{ update.progress }}%</span>{{ update.downloading ? '新版本下载中' : (`检查更新${update.checking ? '中' : ''}`) }}
</a-badge>
</a-button>
</template>
<div class="box">

8
packages/gui/src/view/pages/plugin/git.vue
View File

@ -9,6 +9,8 @@ export default {
data () {
return {
key: 'plugin.git',
labelCol: { span: 4 },
wrapperCol: { span: 20 },
noProxyUrls: [],
needRestart: false,
}
@ -72,9 +74,9 @@ export default {
<ds-container>
<template slot="header">
Git.exe代理设置
<span style="color:#999;">
仅针对git命令行的代理设置，github网站的访问无需设置
</span>
</template>
<template slot="header-right">
仅针对git命令行的代理设置，github网站的访问无需设置
</template>
<div v-if="config">

14
packages/gui/src/view/pages/plugin/node.vue
View File

@ -7,6 +7,8 @@ export default {
data () {
return {
key: 'plugin.node',
labelCol: { span: 4 },
wrapperCol: { span: 20 },
npmVariables: undefined,
registry: false,
}
@ -51,9 +53,9 @@ export default {
<ds-container>
<template slot="header">
NPM加速
<span style="color:#999;">
由于nodejs不走系统证书，所以npm加速不是很好用，可以用淘宝registry
</span>
</template>
<template slot="header-right">
由于nodejs不走系统证书，所以npm加速不是很好用，可以用淘宝registry
</template>
<div v-if="config">
@ -97,7 +99,6 @@ export default {
设置后立即生效，即使关闭 ds 也会继续保持
</div>
</a-form-item>
<a-form-item label="yarn仓库镜像" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-radio-group v-model="config.plugin.node.setting.yarnRegistry" default-value="null" button-style="solid" @change="onSwitchYarnRegistry">
<a-radio-button value="default" title="https://registry.yarnpkg.com">
@ -111,7 +112,6 @@ export default {
设置后立即生效，即使关闭 ds 也会继续保持
</div>
</a-form-item>
<a-form-item label="镜像变量设置" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-checkbox v-model="config.plugin.node.startup.variables">
自动设置，启动npm加速开关时将会设置如下环境变量
@ -123,10 +123,10 @@ export default {
<a-col :span="10">
<a-input v-model="item.key" :title="item.key" read-only />
</a-col>
<a-col :span="10">
<a-col :span="13">
<a-input v-model="item.value" :title="item.value" read-only />
</a-col>
<a-col :span="4">
<a-col :span="1">
<a-icon v-if="item.exists && item.hadSet" title="已设置" style="color:green" type="check" />
<a-icon v-else title="还未设置" style="color:red" type="exclamation-circle" />
</a-col>

10
packages/gui/src/view/pages/plugin/overwall.vue
View File

@ -9,6 +9,8 @@ export default {
data () {
return {
key: 'plugin.overwall',
labelCol: { span: 4 },
wrapperCol: { span: 20 },
targets: undefined,
servers: undefined,
overwallOptions: [
@ -115,9 +117,9 @@ export default {
<ds-container>
<template slot="header">
梯子
<span>
<a-button type="primary" @click="openExternal('https://github.com/docmirror/dev-sidecar-doc/blob/main/ow.md')">原理说明</a-button>
</span>
</template>
<template slot="header-right">
<a-button type="primary" @click="openExternal('https://github.com/docmirror/dev-sidecar-doc/blob/main/ow.md')">原理说明</a-button>
</template>
<div v-if="config">
@ -150,7 +152,7 @@ export default {
注：只要下载成功后，即使关闭自动更新功能，也会优先读取最近下载的文件！
</div>
</a-form-item>
<a-form-item label="远程PAC文件地址" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-form-item label="远程PAC文件" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-input v-model="config.plugin.overwall.pac.pacFileUpdateUrl" :title="config.plugin.overwall.pac.pacFileUpdateUrl" />
<div class="form-help">
远程PAC文件内容可以是<code>base64</code>编码格式，也可以是未经过编码的

2
packages/gui/src/view/pages/plugin/pip.vue
View File

@ -7,6 +7,8 @@ export default {
data () {
return {
key: 'plugin.pip',
labelCol: { span: 4 },
wrapperCol: { span: 20 },
npmVariables: undefined,
registry: false,
trustedHostList: [],

6
packages/gui/src/view/pages/setting.vue
View File

@ -342,9 +342,9 @@ export default {
<ds-container>
<template slot="header">
设置
<span>
<a-button class="md-mr-10" icon="profile" @click="openLog()">查看日志</a-button>
</span>
</template>
<template slot="header-right">
<a-button class="md-mr-10" icon="profile" @click="openLog()">查看日志</a-button>
</template>
<div v-if="config">