optimize: 删除不再使用的 `settings.vue` 页面代码。
王良
parent
a4e648a4ce
commit
116e7c778d
|
|
@ -1,250 +0,0 @@
|
|||
<!--
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="title"
|
||||
placement="right"
|
||||
:closable="false"
|
||||
:visible="visible"
|
||||
:after-visible-change="afterVisibleChange"
|
||||
@close="onClose"
|
||||
width="650px"
|
||||
height="100%"
|
||||
wrapClassName="json-wrapper"
|
||||
>
|
||||
|
||||
<a-tabs
|
||||
default-active-key="1"
|
||||
tab-position="left"
|
||||
: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"></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-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-col>
|
||||
<a-col :span="5">
|
||||
<a-select :disabled="item.value === false" v-model="item.value">
|
||||
<a-select-option value="cloudflare">CloudFlare 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-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="环境变量" key="3">
|
||||
<div>
|
||||
<div>某些库需要自己设置镜像变量，才能下载，比如：electron</div>
|
||||
<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-switch>
|
||||
启动后自动检查设置
|
||||
|
||||
<a-button style="margin-left:10px" @click="doSetNpmVariablesNow">立即设置</a-button>
|
||||
</a-form-item>
|
||||
</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-col>
|
||||
<a-col :span="10">
|
||||
<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-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
|
||||
<a-tab-pane tab="启动设置" key="4" >
|
||||
<div>启动应用程序后自动启动</div>
|
||||
<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-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-switch>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vueJsonEditor from 'vue-json-editor-fix-cn'
|
||||
import lodash from 'lodash'
|
||||
import api from '../api'
|
||||
export default {
|
||||
name: 'setting',
|
||||
components: {
|
||||
vueJsonEditor
|
||||
},
|
||||
props: {
|
||||
config: {
|
||||
type: Object
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '编辑'
|
||||
},
|
||||
visible: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
targetConfig: {},
|
||||
dnsMappings: [],
|
||||
npmVariables: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.resetConfig()
|
||||
},
|
||||
methods: {
|
||||
resetConfig () {
|
||||
this.targetConfig = lodash.cloneDeep(this.config)
|
||||
console.log('targetConfig', this.targetConfig)
|
||||
this.dnsMappings = []
|
||||
for (const key in this.targetConfig.dns.mapping) {
|
||||
const value = this.targetConfig.dns.mapping[key]
|
||||
this.dnsMappings.push({
|
||||
key, value
|
||||
})
|
||||
}
|
||||
|
||||
api.config.getVariables('npm').then(ret => {
|
||||
this.npmVariables = ret
|
||||
})
|
||||
},
|
||||
afterVisibleChange (val) {
|
||||
console.log('visible', val)
|
||||
if (val === true) {
|
||||
this.resetConfig()
|
||||
}
|
||||
},
|
||||
showDrawer () {
|
||||
this.$emit('update:visible', true)
|
||||
},
|
||||
onClose () {
|
||||
if (this.isChanged()) {
|
||||
this.$confirm({
|
||||
title: '提示',
|
||||
content: '是否需要保存？',
|
||||
cancelText: '取消',
|
||||
okText: '确定',
|
||||
onOk: () => {
|
||||
this.doSave()
|
||||
},
|
||||
onCancel () {}
|
||||
})
|
||||
}
|
||||
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
syncTargetConfig () {
|
||||
const mapping = {}
|
||||
for (const item of this.dnsMappings) {
|
||||
mapping[item.key] = item.value
|
||||
}
|
||||
this.targetConfig.dns.mapping = mapping
|
||||
|
||||
const variables = {}
|
||||
for (const item of this.npmVariables) {
|
||||
variables[item.key] = item.value
|
||||
}
|
||||
this.targetConfig.variables.npm = variables
|
||||
},
|
||||
isChanged () {
|
||||
this.syncTargetConfig()
|
||||
return !lodash.isEqual(this.config, this.targetConfig)
|
||||
},
|
||||
doSave () {
|
||||
return api.config.save(this.targetConfig).then(ret => {
|
||||
this.$emit('change', ret.diffConfig)
|
||||
})
|
||||
},
|
||||
deleteDnsMapping (item, index) {
|
||||
this.dnsMappings.splice(index, 1)
|
||||
},
|
||||
restoreDefDnsMapping (item, index) {
|
||||
|
||||
},
|
||||
addDnsMapping () {
|
||||
this.dnsMappings.unshift({ key: '', value: 'quad9' })
|
||||
},
|
||||
doSetNpmVariablesNow () {
|
||||
this.syncTargetConfig()
|
||||
this.doSave().then(() => {
|
||||
return api.config.setVariables('npm')
|
||||
}).then(() => {
|
||||
return api.config.getVariables('npm').then(ret => {
|
||||
this.npmVariables = ret
|
||||
})
|
||||
}).then(() => {
|
||||
this.$message.success('设置成功')
|
||||
})
|
||||
},
|
||||
addNpmVariable () {
|
||||
this.npmVariables.push({ key: '', value: '', exists: false })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.json-wrapper .ant-drawer-wrapper-body{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.json-wrapper .ant-drawer-wrapper-body .ant-drawer-body{
|
||||
flex: 1;
|
||||
height: 0;
|
||||
}
|
||||
.json-wrapper .jsoneditor-vue{
|
||||
height:100%
|
||||
}
|
||||
.json-wrapper .ant-tabs{
|
||||
height: 100%;
|
||||
}
|
||||
.json-wrapper .ant-tabs-content{
|
||||
height: 100%;
|
||||
}
|
||||
.json-wrapper .ant-tabs-tabpane-active{
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.a-form{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
-->
|
||||
Loading…
Reference in New Issue