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

“恢复默认”按钮，添加loading效果。

pull/287/head
王良 2024-04-02 12:38:02 +08:00
parent e40bf546d0
commit 1d6c9d0fd4
12 changed files with 57 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -14,7 +14,7 @@
>
<template v-for="(item) of menus">
<a-sub-menu v-if="item.children && item.children.length>0" :key="item.path" @titleClick="titleClick(item)">
<span slot="title"><a-icon :type="item.icon?item.icon:'file'" /><span>{{item.title}}</span></span>
<span slot="title"><a-icon :type="item.icon?item.icon:'file'"/><span>{{item.title}}</span></span>
<a-menu-item v-for="(sub) of item.children" :key="sub.path" @click="menuClick(sub)" >
<a-icon :type="sub.icon?sub.icon:'file'"/> {{ sub.title }}
</a-menu-item>
@ -24,11 +24,8 @@
<span class="nav-text">{{ item.title }}</span>
</a-menu-item>
</template>
</a-menu>
</div>
</a-layout-sider>
<a-layout>
<!-- <a-layout-header>Header</a-layout-header>-->

39
packages/gui/src/view/components/settings.vue
View File

@ -17,32 +17,31 @@
:style="{ height: '100%' }"
>
<a-tab-pane tab="拦截设置" key="1" >
<vue-json-editor style="height:100%;" ref="editor" v-model="targetConfig.intercepts" mode="code" :show-btns="false" :expandedOnStart="true" @json-change="onJsonChange"></vue-json-editor>
<vue-json-editor style="height:100%;" ref="editor" v-model="targetConfig.intercepts" mode="code" :show-btns="false" :expandedOnStart="true"></vue-json-editor>
</a-tab-pane>
<a-tab-pane tab="DNS设置" key="2">
<div>
<div>某些域名有时候需要通过其他DNS服务器获取到的IP才可以访问</div>
<a-row style="margin-top:10px">
<a-col>
<a-button type="primary" icon="plus" @click="addDnsMapping()" />
<a-button type="primary" icon="plus" @click="addDnsMapping()"/>
</a-col>
</a-row>
<a-row :gutter="10" style="margin-top: 10px" v-for="(item,index) of dnsMappings" :key = 'index'>
<a-col :span="14">
<a-input :disabled="item.value ===false" v-model="item.key"></a-input>
<a-input :disabled="item.value === false" v-model="item.key"></a-input>
</a-col>
<a-col :span="5">
<a-select :disabled="item.value ===false" v-model="item.value">
<a-select :disabled="item.value === false" v-model="item.value">
<a-select-option value="usa">USA DNS</a-select-option>
<a-select-option value="aliyun">Aliyun DNS</a-select-option>
</a-select>
</a-col>
<a-col :span="3">
<a-button v-if="item.value!==false" style="margin-left:10px" type="danger" icon="minus" @click="deleteDnsMapping(item,index)" />
<a-button v-if="item.value===false" style="margin-left:10px" type="primary" icon="checked" @click="restoreDefDnsMapping(item,index)" ></a-button>
<a-button v-if="item.value !== false" style="margin-left:10px" type="danger" icon="minus" @click="deleteDnsMapping(item,index)"/>
<a-button v-if="item.value === false" style="margin-left:10px" type="primary" icon="checked" @click="restoreDefDnsMapping(item,index)" ></a-button>
</a-col>
</a-row>
</div>
</a-tab-pane>
<a-tab-pane tab="环境变量" key="3">
@ -51,8 +50,8 @@
<div>
<a-form-item label="镜像环境变量" >
<a-switch v-model="targetConfig.setting.startup.variables.npm" default-checked v-on:click="(checked)=>{targetConfig.setting.startup.variables.npm = checked}">
<a-icon slot="checkedChildren" type="check" />
<a-icon slot="unCheckedChildren" type="close" />
<a-icon slot="checkedChildren" type="check"/>
<a-icon slot="unCheckedChildren" type="close"/>
</a-switch>
启动后自动检查设置
@ -61,14 +60,14 @@
</div>
<a-row :gutter="10" style="margin-top: 10px" v-for="(item,index) of npmVariables" :key = 'index'>
<a-col :span="10">
<a-input :disabled="item.key ===false" v-model="item.key"></a-input>
<a-input :disabled="item.key === false" v-model="item.key"></a-input>
</a-col>
<a-col :span="10">
<a-input :disabled="item.value ===false" v-model="item.value"></a-input>
<a-input :disabled="item.value === false" v-model="item.value"></a-input>
</a-col>
<a-col :span="4">
<a-icon v-if="item.exists" style="color:green" type="check" />
<a-icon v-if="!item.exists" title="还未设置" style="color:red" type="exclamation-circle" />
<a-icon v-if="item.exists" style="color:green" type="check"/>
<a-icon v-if="!item.exists" title="还未设置" style="color:red" type="exclamation-circle"/>
</a-col>
</a-row>
</div>
@ -79,15 +78,15 @@
<a-form style="margin-top: 20px" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }" >
<a-form-item label="代理服务" >
<a-switch v-model="targetConfig.setting.startup.server" default-checked v-on:click="(checked)=>{targetConfig.setting.startup.server = checked}">
<a-icon slot="checkedChildren" type="check" />
<a-icon slot="unCheckedChildren" type="close" />
<a-icon slot="checkedChildren" type="check"/>
<a-icon slot="unCheckedChildren" type="close"/>
</a-switch>
</a-form-item>
<a-form-item v-for="(item,key) in targetConfig.setting.startup.proxy" :key="key" :label="key">
<a-switch v-model="targetConfig.setting.startup.proxy[key]" default-checked v-on:click="(checked)=>{targetConfig.setting.startup.proxy[key] = checked}">
<a-icon slot="checkedChildren" type="check" />
<a-icon slot="unCheckedChildren" type="close" />
<a-icon slot="checkedChildren" type="check"/>
<a-icon slot="unCheckedChildren" type="close"/>
</a-switch>
</a-form-item>
</a-form>
@ -144,8 +143,6 @@ export default {
this.npmVariables = ret
})
},
onJsonChange (config) {
},
afterVisibleChange (val) {
console.log('visible', val)
if (val === true) {
@ -200,7 +197,7 @@ export default {
},
addDnsMapping () {
this.dnsMappings.unshift({ key: '', value: 'usa' })
this.dnsMappings.unshift({ key: '', value: 'quad9' })
},
doSetNpmVariablesNow () {
this.syncTargetConfig()
@ -211,7 +208,7 @@ export default {
this.npmVariables = ret
})
}).then(() => {
this.$message.info('设置成功')
this.$message.success('设置成功')
})
},
addNpmVariable () {

2
packages/gui/src/view/components/setup-ca.vue
View File

@ -33,7 +33,7 @@
2、然后按如下图步骤将根证书添加到<b style="color:red">信任的根证书颁发机构</b><br/>
</template>
</div>
<img width="100%" :src="setupImage" />
<img width="100%" :src="setupImage"/>
</a-drawer>
</template>

9
packages/gui/src/view/mixins/plugin.js
View File

@ -12,6 +12,7 @@ export default {
status: {},
labelCol: { span: 4 },
wrapperCol: { span: 20 },
resetDefaultLoading: false,
applyLoading: false,
systemPlatform: ''
}
@ -43,7 +44,7 @@ export default {
},
async apply () {
if (this.applyLoading === true) {
return
return // 防重复提交
}
this.applyLoading = true
await this.applyBefore()
@ -65,20 +66,22 @@ export default {
cancelText: '取消',
okText: '确定',
onOk: async () => {
this.resetDefaultLoading = true
this.config = await this.$api.config.resetDefault(key)
if (this.ready) {
await this.ready(this.config)
}
await this.apply()
this.resetDefaultLoading = false
},
onCancel () {}
})
},
saveConfig () {
return this.$api.config.save(this.config).then((ret) => {
this.$message.info('设置已保存')
this.$message.success('设置已保存')
this.setConfig(ret.allConfig)
this.printConfig('after saveConfig(), ')
this.printConfig('After saveConfig(), ')
return ret
})
},

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

@ -3,9 +3,8 @@
<template slot="header">
给开发者的辅助工具
<span>
<a-button style="margin-right:10px" @click="openSetupCa">
<a-badge :count="_rootCaSetuped?0:1" dot>安装根证书 </a-badge>
<a-badge :count="_rootCaSetuped?0:1" dot>安装根证书</a-badge>
</a-button>
<a-button style="margin-right:10px" @click="doCheckUpdate(true)" :loading="update.downloading"
@ -14,7 +13,6 @@
<span v-if="update.downloading">{{ update.progress }}%</span>{{ update.downloading ? '新版本下载中' : '检查更新' }}
</a-badge>
</a-button>
</span>
</template>
@ -108,7 +106,6 @@
</div>
</a-modal>
</div>
</ds-container>
</template>
@ -205,7 +202,7 @@ export default {
this.config.plugin.overwall.enabled = true
}
this.$api.config.save(this.config).then(() => {
this.$message.info('设置已保存')
this.$message.success('设置已保存')
})
if (this.status.server.enabled) {
return this.$api.server.restart()
@ -231,7 +228,7 @@ export default {
this.$confirm({
title: '第一次使用，请先安装CA根证书',
content: '本应用正常使用，必须安装和信任CA根证书',
cancelText: '下次',
cancelText: '下次安装',
okText: '去安装',
onOk: () => {
this.openSetupCa()
@ -252,6 +249,8 @@ export default {
await this.$api.shell.setupCa({ certPath: this.config.server.setting.rootCaFile.certPath })
this.setting.rootCa = this.setting.rootCa || {}
const rootCa = this.setting.rootCa
// 根证书已安装
rootCa.setuped = true
this.$set(this, 'setting', this.setting)
this.$api.setting.save(this.setting)

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

@ -30,7 +30,7 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>

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

@ -58,10 +58,10 @@
<div class="form-help">某些库需要自己设置镜像变量，才能下载，比如：electron</div>
<a-row :gutter="10" style="margin-top: 10px" v-for="(item,index) of npmVariables" :key='index'>
<a-col :span="10">
<a-input :disabled="item.key ===false" v-model="item.key"></a-input>
<a-input :disabled="item.key === false" v-model="item.key"></a-input>
</a-col>
<a-col :span="10">
<a-input :disabled="item.value ===false" v-model="item.value"></a-input>
<a-input :disabled="item.value === false" v-model="item.value"></a-input>
</a-col>
<a-col :span="4">
<a-icon v-if="item.exists&& item.hadSet" title="已设置" style="color:green" type="check"/>
@ -73,7 +73,7 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>

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

@ -30,7 +30,7 @@
<span>PAC没有拦截到的域名，可以在此处定义</span>
</a-col>
<a-col :span="2">
<a-button type="primary" icon="plus" @click="addTarget()" />
<a-button type="primary" icon="plus" @click="addTarget()"/>
</a-col>
</a-row>
<a-row :gutter="10" v-for="(item,index) of targets" :key = 'index'>
@ -38,7 +38,7 @@
<a-input v-model="item.key"></a-input>
</a-col>
<a-col :span="2">
<a-button type="danger" icon="minus" @click="deleteTarget(item,index)" />
<a-button type="danger" icon="minus" @click="deleteTarget(item,index)"/>
</a-col>
</a-row>
</div>
@ -50,7 +50,7 @@
<span>Nginx二层代理服务端配置</span>
</a-col>
<a-col :span="2">
<a-button type="primary" icon="plus" @click="addServer()" />
<a-button type="primary" icon="plus" @click="addServer()"/>
</a-col>
</a-row>
<a-row :gutter="10" v-for="(item,index) of servers" :key = 'index'>
@ -67,7 +67,7 @@
<a-input addon-before="密码" type="password" placeholder="password" v-model="item.value.password"/>
</a-col>
<a-col :span="2">
<a-button type="danger" icon="minus" @click="deleteServer(item,index)" />
<a-button type="danger" icon="minus" @click="deleteServer(item,index)"/>
</a-col>
</a-row>
<div class="form-help">您可以在此处配置你自己的服务器地址</div>
@ -78,7 +78,7 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>

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

@ -43,7 +43,7 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>

2
packages/gui/src/view/pages/proxy.vue
View File

@ -55,7 +55,7 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>

23
packages/gui/src/view/pages/server.vue
View File

@ -69,7 +69,7 @@
</a-tab-pane>
<a-tab-pane tab="拦截设置" key="2">
<vue-json-editor style="height:100%;" ref="editor" v-model="config.server.intercepts" mode="code"
:show-btns="false" :expandedOnStart="true" @json-change="onJsonChange"></vue-json-editor>
:show-btns="false" :expandedOnStart="true"></vue-json-editor>
</a-tab-pane>
<a-tab-pane tab="域名白名单" key="3">
<a-row style="margin-top:10px">
@ -82,10 +82,10 @@
</a-row>
<a-row :gutter="10" style="margin-top: 10px" v-for="(item,index) of whiteList" :key='index'>
<a-col :span="19">
<a-input :disabled="item.value ===false" v-model="item.key"></a-input>
<a-input :disabled="item.value === false" v-model="item.key"></a-input>
</a-col>
<a-col :span="3">
<a-button v-if="item.value!==false" type="danger" icon="minus" @click="deleteWhiteList(item,index)"/>
<a-button v-if="item.value !== false" type="danger" icon="minus" @click="deleteWhiteList(item,index)"/>
</a-col>
</a-row>
</a-tab-pane>
@ -101,18 +101,18 @@
</a-row>
<a-row :gutter="10" style="margin-top: 10px" v-for="(item,index) of dnsMappings" :key='index'>
<a-col :span="14">
<a-input :disabled="item.value ===false" v-model="item.key"></a-input>
<a-input :disabled="item.value === false" v-model="item.key"></a-input>
</a-col>
<a-col :span="5">
<a-select :disabled="item.value ===false" v-model="item.value" style="width: 100%">
<a-select :disabled="item.value === false" v-model="item.value" style="width: 100%">
<a-select-option v-for="(item) of speedDnsOptions" :key="item.value" :value="item.value">
{{ item.value }}
</a-select-option>
</a-select>
</a-col>
<a-col :span="3">
<a-button v-if="item.value!==false" type="danger" icon="minus" @click="deleteDnsMapping(item,index)"/>
<a-button v-if="item.value===false" type="primary" icon="checked"
<a-button v-if="item.value !== false" type="danger" icon="minus" @click="deleteDnsMapping(item,index)"/>
<a-button v-if="item.value === false" type="primary" icon="checked"
@click="restoreDefDnsMapping(item,index)"></a-button>
</a-col>
</a-row>
@ -206,12 +206,11 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>
</ds-container>
</template>
<script>
@ -228,8 +227,6 @@ export default {
data () {
return {
key: 'server',
labelCol: { span: 4 },
wrapperCol: { span: 20 },
dnsMappings: [],
speedTestList: [],
whiteList: [],
@ -269,8 +266,6 @@ export default {
this.config.server.setting.rootCaFile.keyPath = value[0]
}
},
onJsonChange (json) {
},
ready () {
this.initDnsMapping()
this.initWhiteList()
@ -315,7 +310,7 @@ export default {
},
addDnsMapping () {
this.dnsMappings.unshift({ key: '', value: 'usa' })
this.dnsMappings.unshift({ key: '', value: 'quad9' })
},
// whiteList

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

@ -15,8 +15,8 @@
windows下建议开启开机自启。<a @click="openExternal('https://github.com/docmirror/dev-sidecar/blob/master/doc/recover.md')">更多说明参考</a>
</div>
</a-form-item>
<a-form-item v-if="systemPlatform ==='mac'" label="隐藏Dock图标" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-checkbox v-model="config.app.dock.hideWhenWinClose" >
<a-form-item v-if="systemPlatform === 'mac'" label="隐藏Dock图标" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-checkbox v-model="config.app.dock.hideWhenWinClose">
关闭窗口时隐藏Dock图标(仅限Mac)
</a-checkbox>
<div class="form-help">
@ -42,7 +42,7 @@
<br/>如果重载远程配置后发现下载的还是修改前的内容，请稍等片刻再重试。
</div>
</a-form-item>
<a-form-item label="首页提示" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-form-item label="首页提示" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-radio-group v-model="config.app.showShutdownTip"
default-value="true" button-style="solid">
<a-radio-button :value="true">
@ -76,7 +76,7 @@
</div>
<template slot="footer">
<div class="footer-bar">
<a-button class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="resetDefaultLoading" class="md-mr-10" icon="sync" @click="resetDefault()">恢复默认</a-button>
<a-button :loading="applyLoading" icon="check" type="primary" @click="apply()">应用</a-button>
</div>
</template>
@ -143,9 +143,9 @@ export default {
if (remoteConfig.old === remoteConfig.new) {
this.$message.info('远程配置没有变化，不做任何处理。')
this.$message.info('如果您确实修改了远程配置，请稍等片刻再重试！')
this.$message.warn('如果您确实修改了远程配置，请稍等片刻再重试！')
} else {
this.$message.info('获取到了最新的远程配置，开始重启代理服务和系统代理')
this.$message.success('获取到了最新的远程配置，开始重启代理服务和系统代理')
await this.reloadAndRestart()
}