mirror of
https://github.com/iczer/vue-antd-admin
synced 2025-04-06 04:00:06 +08:00
feat: add the function of copying configuration code; 🌟
新增:复制配置项代码的功能;
This commit is contained in:
parent
b5d17cd63b
commit
40472b21dd
@ -89,7 +89,13 @@
|
|||||||
</a-list-item>
|
</a-list-item>
|
||||||
</a-list>
|
</a-list>
|
||||||
</setting-item>
|
</setting-item>
|
||||||
<a-button id="copyBtn" data-clipboard-text="Sorry, you have copied nothing O(∩_∩)O~" @click="copyCode" style="width: 100%" icon="copy" >{{$t('copy')}}</a-button>
|
<a-alert
|
||||||
|
style="max-width: 224px; margin: -16px 0 8px"
|
||||||
|
message="拷贝配置后,直接覆盖文件 src/config/config.js 中的全部内容即可"
|
||||||
|
type="warning"
|
||||||
|
:closable="true"
|
||||||
|
/>
|
||||||
|
<a-button id="copyBtn" :data-clipboard-text="copyConfig" @click="copyCode" style="width: 100%" icon="copy" >{{$t('copy')}}</a-button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -99,6 +105,8 @@ import ColorCheckbox from '../checkbox/ColorCheckbox'
|
|||||||
import ImgCheckbox from '../checkbox/ImgCheckbox'
|
import ImgCheckbox from '../checkbox/ImgCheckbox'
|
||||||
import Clipboard from 'clipboard'
|
import Clipboard from 'clipboard'
|
||||||
import { mapState, mapMutations } from 'vuex'
|
import { mapState, mapMutations } from 'vuex'
|
||||||
|
import {formatConfig} from '@/utils/formatter'
|
||||||
|
import {setting} from '@/config/default'
|
||||||
|
|
||||||
const ColorCheckboxGroup = ColorCheckbox.Group
|
const ColorCheckboxGroup = ColorCheckbox.Group
|
||||||
const ImgCheckboxGroup = ImgCheckbox.Group
|
const ImgCheckboxGroup = ImgCheckbox.Group
|
||||||
@ -108,6 +116,7 @@ export default {
|
|||||||
components: {ImgCheckboxGroup, ImgCheckbox, ColorCheckboxGroup, ColorCheckbox, SettingItem},
|
components: {ImgCheckboxGroup, ImgCheckbox, ColorCheckboxGroup, ColorCheckbox, SettingItem},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
copyConfig: 'Sorry, you have copied nothing O(∩_∩)O~'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -123,6 +132,17 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
copyCode () {
|
copyCode () {
|
||||||
|
let config = {}
|
||||||
|
// 提取配置
|
||||||
|
let mySetting = this.$store.state.setting
|
||||||
|
Object.keys(mySetting).forEach(key => {
|
||||||
|
if (setting[key]) {
|
||||||
|
config[key] = mySetting[key]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.copyConfig = '// 自定义配置,参考 ./default/setting.js,需要自定义的属性在这里配置即可\n'
|
||||||
|
this.copyConfig += 'module.exports = '
|
||||||
|
this.copyConfig += formatConfig(config)
|
||||||
let clipboard = new Clipboard('#copyBtn')
|
let clipboard = new Clipboard('#copyBtn')
|
||||||
const _this = this
|
const _this = this
|
||||||
clipboard.on('success', function () {
|
clipboard.on('success', function () {
|
||||||
|
68
src/utils/formatter.js
Normal file
68
src/utils/formatter.js
Normal file
@ -0,0 +1,68 @@
|
|||||||
|
/**
|
||||||
|
* 把对象按照 js配置文件的格式进行格式化
|
||||||
|
* @param obj 格式化的对象
|
||||||
|
* @param dep 层级,此项无需传值
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
|
function formatConfig(obj, dep) {
|
||||||
|
dep = dep || 1
|
||||||
|
const LN = '\n', TAB = ' '
|
||||||
|
let indent = ''
|
||||||
|
for (let i = 0; i < dep; i++) {
|
||||||
|
indent += TAB
|
||||||
|
}
|
||||||
|
let isArray = false, arrayLastIsObj = false
|
||||||
|
let str = '', prefix = '{', subfix = '}'
|
||||||
|
if (Array.isArray(obj)) {
|
||||||
|
isArray = true
|
||||||
|
prefix = '['
|
||||||
|
subfix = ']'
|
||||||
|
str = obj.map((item, index) => {
|
||||||
|
let format = ''
|
||||||
|
if (typeof item == 'function') {
|
||||||
|
//
|
||||||
|
} else if (typeof item == 'object') {
|
||||||
|
arrayLastIsObj = true
|
||||||
|
format = `${LN}${indent}${formatConfig(item,dep + 1)},`
|
||||||
|
} else if (typeof item == 'number' && !isNaN(item)) {
|
||||||
|
format = `${item},`
|
||||||
|
} else if (typeof item == 'string') {
|
||||||
|
format = `'${item}',`
|
||||||
|
}
|
||||||
|
if (index == obj.length - 1) {
|
||||||
|
format = format.substring(0, format.length - 1)
|
||||||
|
} else {
|
||||||
|
arrayLastIsObj = false
|
||||||
|
}
|
||||||
|
return format
|
||||||
|
}).join('')
|
||||||
|
} else if (typeof obj != 'function' && typeof obj == 'object') {
|
||||||
|
str = Object.keys(obj).map((key, index, keys) => {
|
||||||
|
const val = obj[key]
|
||||||
|
let format = ''
|
||||||
|
if (typeof val == 'function') {
|
||||||
|
//
|
||||||
|
} else if (typeof val == 'object') {
|
||||||
|
format = `${LN}${indent}${key}: ${formatConfig(val,dep + 1)},`
|
||||||
|
} else if (typeof val == 'number' && !isNaN(val)) {
|
||||||
|
format = `${LN}${indent}${key}: ${val},`
|
||||||
|
} else if (typeof val == 'string') {
|
||||||
|
format = `${LN}${indent}${key}: '${val}',`
|
||||||
|
}
|
||||||
|
if (index == keys.length - 1) {
|
||||||
|
format = format.substring(0, format.length - 1)
|
||||||
|
}
|
||||||
|
return format
|
||||||
|
}).join('')
|
||||||
|
}
|
||||||
|
const len = TAB.length
|
||||||
|
if (indent.length >= len) {
|
||||||
|
indent = indent.substring(0, indent.length - len)
|
||||||
|
}
|
||||||
|
if (!isArray || arrayLastIsObj) {
|
||||||
|
subfix = LN + indent +subfix
|
||||||
|
}
|
||||||
|
return`${prefix}${str}${subfix}`
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {formatConfig}
|
Loading…
x
Reference in New Issue
Block a user