Finished: other picbed page

This commit is contained in:
PiEgg 2018-12-23 23:15:00 +08:00
parent 2d63f2ff42
commit ae9d8eee13
12 changed files with 262 additions and 77 deletions

View File

@ -5,8 +5,8 @@ import { app, BrowserWindow, Tray, Menu, Notification, clipboard, ipcMain, globa
import db from '../datastore'
import pasteTemplate from './utils/pasteTemplate'
import updateChecker from './utils/updateChecker'
import { getPicBeds } from './utils/getPicBeds'
import pkg from '../../package.json'
import picBed from '../datastore/pic-bed'
import picgoCoreIPC from './utils/picgoCoreIPC'
/**
* Set `__static` path to static files in production
@ -38,7 +38,8 @@ const miniWinURL = process.env.NODE_ENV === 'development'
function createTray () {
const menubarPic = process.platform === 'darwin' ? `${__static}/menubar.png` : `${__static}/menubar-nodarwin.png`
tray = new Tray(menubarPic)
const submenu = picBed.map(item => {
const picBeds = getPicBeds(app)
const submenu = picBeds.map(item => {
return {
label: item.name,
type: 'radio',
@ -354,7 +355,8 @@ const uploadClipboardFiles = async () => {
const updateDefaultPicBed = () => {
if (process.platform === 'darwin' || process.platform === 'win32') {
const types = picBed.map(item => item.type)
const picBeds = getPicBeds(app)
const types = picBeds.map(item => item.type)
let submenuItem = contextMenu.items[2].submenu.items
submenuItem.forEach((item, index) => {
const result = db.read().get('picBed.current').value() === types[index]
@ -484,6 +486,11 @@ ipcMain.on('syncPicBed', (evt) => {
updateDefaultPicBed()
})
ipcMain.on('getPicBeds', (evt) => {
const picBeds = getPicBeds(app)
evt.sender.send('getPicBeds', picBeds)
})
const shortKeyHash = {
upload: uploadClipboardFiles
}

View File

@ -0,0 +1,26 @@
import path from 'path'
import db from '../../datastore'
// eslint-disable-next-line
const requireFunc = typeof __webpack_require__ === 'function' ? __non_webpack_require__ : require
const getPicBeds = (app) => {
const PicGo = requireFunc('picgo')
const STORE_PATH = app.getPath('userData')
const CONFIG_PATH = path.join(STORE_PATH, '/data.json')
const picgo = new PicGo(CONFIG_PATH)
const picBedTypes = picgo.helper.uploader.getIdList()
const picBedFromDB = db.read().get('picBed.list').value() || []
const picBeds = picBedTypes.map(item => {
const visible = picBedFromDB.find(i => i.type === item) // object or undefined
return {
type: item,
name: picgo.helper.uploader.get(item).name || item,
visible: visible ? visible.visible : true
}
})
return picBeds
}
export {
getPicBeds
}

View File

@ -75,7 +75,7 @@ const handleGetPluginList = (ipcMain, STORE_PATH, CONFIG_PATH) => {
})
}
const handlePluginInstall = (ipcMain, STORE_PATH, CONFIG_PATH) => {
const handlePluginInstall = (ipcMain, CONFIG_PATH) => {
ipcMain.on('installPlugin', (event, msg) => {
const picgo = new PicGo(CONFIG_PATH)
const pluginHandler = new PluginHandler(picgo)
@ -87,7 +87,7 @@ const handlePluginInstall = (ipcMain, STORE_PATH, CONFIG_PATH) => {
})
}
const handlePluginUninstall = (ipcMain, STORE_PATH, CONFIG_PATH) => {
const handlePluginUninstall = (ipcMain, CONFIG_PATH) => {
ipcMain.on('uninstallPlugin', (event, msg) => {
const picgo = new PicGo(CONFIG_PATH)
const pluginHandler = new PluginHandler(picgo)
@ -99,7 +99,7 @@ const handlePluginUninstall = (ipcMain, STORE_PATH, CONFIG_PATH) => {
})
}
const handlePluginUpdate = (ipcMain, STORE_PATH, CONFIG_PATH) => {
const handlePluginUpdate = (ipcMain, CONFIG_PATH) => {
ipcMain.on('updatePlugin', (event, msg) => {
const picgo = new PicGo(CONFIG_PATH)
const pluginHandler = new PluginHandler(picgo)
@ -111,11 +111,21 @@ const handlePluginUpdate = (ipcMain, STORE_PATH, CONFIG_PATH) => {
})
}
const handleGetPicBedConfig = (ipcMain, CONFIG_PATH) => {
ipcMain.on('getPicBedConfig', (event, type) => {
const picgo = new PicGo(CONFIG_PATH)
const config = handleConfigWithFunction(picgo.helper.uploader.get(type).config(picgo))
const name = picgo.helper.uploader.get(type).name || type
event.sender.send('getPicBedConfig', config, name)
})
}
export default (app, ipcMain) => {
const STORE_PATH = app.getPath('userData')
const CONFIG_PATH = path.join(STORE_PATH, '/data.json')
handleGetPluginList(ipcMain, STORE_PATH, CONFIG_PATH)
handlePluginInstall(ipcMain, STORE_PATH, CONFIG_PATH)
handlePluginUninstall(ipcMain, STORE_PATH, CONFIG_PATH)
handlePluginUpdate(ipcMain, STORE_PATH, CONFIG_PATH)
handlePluginInstall(ipcMain, CONFIG_PATH)
handlePluginUninstall(ipcMain, CONFIG_PATH)
handlePluginUpdate(ipcMain, CONFIG_PATH)
handleGetPicBedConfig(ipcMain, CONFIG_PATH)
}

View File

@ -27,8 +27,22 @@
>
<el-option
v-for="(choice, idx) in item.choices"
:label="choice.name || choice"
:key="choice"
:label="choice.name || choice.value || choice"
:key="choice.name || choice.value || choice"
:value="choice.value || choice"
></el-option>
</el-select>
<el-select
v-else-if="item.type === 'checkbox'"
v-model="ruleForm[item.name]"
:placeholder="item.message || item.name"
multiple
collapse-tags
>
<el-option
v-for="(choice, idx) in item.choices"
:label="choice.name || choice.value || choice"
:key="choice.value || choice"
:value="choice.value || choice"
></el-option>
</el-select>
@ -40,17 +54,21 @@
>
</el-switch>
</el-form-item>
<slot></slot>
</el-form>
</div>
</template>
<script>
import { cloneDeep } from 'lodash'
import { cloneDeep, union } from 'lodash'
export default {
name: 'config-form',
props: {
config: Array,
type: String,
name: String
id: {
type: String,
default: ''
}
},
data () {
return {
@ -59,23 +77,33 @@ export default {
}
},
created () {
this.configList = cloneDeep(this.config).map(item => {
const defaultValue = item.default !== undefined ? item.default : null
this.$set(this.ruleForm, item.name, defaultValue)
return item
})
},
watch: {
config: {
deep: true,
handler (val) {
this.ruleForm = Object.assign({}, {})
this.configList = cloneDeep(val).map(item => {
const defaultValue = item.default !== undefined ? item.default : null
this.$set(this.ruleForm, item.name, defaultValue)
return item
})
}
const config = this.$db.read().get(`picBed.${this.id}`).value()
if (val.length > 0) {
this.configList = cloneDeep(val).map(item => {
let defaultValue = item.default !== undefined
? item.default : item.type === 'checkbox'
? [] : null
if (item.type === 'checkbox') {
const defaults = item.choices.filter(i => {
return i.checked
}).map(i => i.value)
defaultValue = union(defaultValue, defaults)
}
if (config && config[item.name] !== undefined) {
defaultValue = config[item.name]
}
this.$set(this.ruleForm, item.name, defaultValue)
return item
})
}
},
immediate: true
}
},
methods: {

View File

@ -36,7 +36,7 @@
>
<el-menu-item
v-if="item.visible"
:index="item.type"
:index="`picbeds-${item.type}`"
:key="item.type"
>
<!-- <i :class="`el-icon-ui-${item.type}`"></i> -->
@ -168,18 +168,39 @@ export default {
shortKey: {
upload: db.read().get('shortKey.upload').value()
},
picBed: this.$picBed
picBed: []
}
},
created () {
this.os = process.platform
this.buildMenu()
this.getPicBeds()
this.$electron.ipcRenderer.on('getPicBeds', (event, picBeds) => {
this.picBed = picBeds
})
},
methods: {
handleSelect (index) {
this.$router.push({
name: index
})
const type = index.match(/picbeds-/)
if (type === null) {
this.$router.push({
name: index
})
} else {
const picBed = index.replace(/picbeds-/, '')
if (this.$builtInPicBed.includes(picBed)) {
this.$router.push({
name: picBed
})
} else {
this.$router.push({
name: 'others',
query: {
type: picBed
}
})
}
}
},
minimizeWindow () {
const window = BrowserWindow.getFocusedWindow()
@ -244,12 +265,18 @@ export default {
},
openMiniWindow () {
this.$electron.ipcRenderer.send('openMiniWindow')
},
getPicBeds () {
this.$electron.ipcRenderer.send('getPicBeds')
}
},
beforeRouteEnter: (to, from, next) => {
next(vm => {
vm.defaultActive = to.name
})
},
beforeDestroy () {
this.$electron.ipcRenderer.removeAllListeners('getPicBeds')
}
}
</script>

View File

@ -8,7 +8,6 @@ import store from './store'
import db from '../datastore/index'
import { webFrame } from 'electron'
import './assets/fonts/iconfont.css'
import picBed from '../datastore/pic-bed'
import VueLazyLoad from 'vue-lazyload'
Vue.use(ElementUI)
@ -20,7 +19,16 @@ webFrame.setLayoutZoomLevelLimits(0, 0)
if (!process.env.IS_WEB) Vue.use(require('vue-electron'))
Vue.http = Vue.prototype.$http = axios
Vue.prototype.$db = db
Vue.prototype.$picBed = picBed
Vue.prototype.$builtInPicBed = [
'smms',
'weibo',
'imgur',
'qiniu',
'tcyun',
'upyun',
'aliyun',
'github'
]
Vue.config.productionTip = false
/* eslint-disable no-new */

View File

@ -16,7 +16,7 @@
style="width: 100%"
placeholder="请选择显示的图床">
<el-option
v-for="item in $picBed"
v-for="item in picBed"
:key="item.type"
:label="item.name"
:value="item.type">
@ -135,7 +135,8 @@ export default {
URL: 'URL',
UBB: 'UBB',
Custom: 'Custom'
}
},
picBed: []
}
},
created () {
@ -145,7 +146,11 @@ export default {
this.filterList = this.getGallery()
})
})
this.$electron.ipcRenderer.on('getPicBeds', (event, picBeds) => {
this.picBed = picBeds
})
this.getPasteStyle()
this.getPicBeds()
},
computed: {
filterList: {
@ -158,6 +163,9 @@ export default {
}
},
methods: {
getPicBeds () {
this.$electron.ipcRenderer.send('getPicBeds')
},
getGallery () {
if (this.choosedPicBed.length > 0) {
let arr = []
@ -335,6 +343,7 @@ export default {
},
beforeDestroy () {
this.$electron.ipcRenderer.removeAllListeners('updateGallery')
this.$electron.ipcRenderer.removeAllListeners('getPicBeds')
}
}
</script>

View File

@ -17,7 +17,6 @@
</template>
<script>
import mixin from '@/utils/mixin'
import picBed from '~/datastore/pic-bed.js'
export default {
name: 'mini-page',
mixins: [mixin],
@ -34,13 +33,13 @@ export default {
screenX: '',
screenY: '',
menu: null,
os: ''
os: '',
picBed: []
}
},
created () {
this.os = process.platform
},
mounted () {
this.getPicBeds()
this.$electron.ipcRenderer.on('uploadProgress', (event, progress) => {
if (progress !== -1) {
this.showProgress = true
@ -50,7 +49,12 @@ export default {
this.showError = true
}
})
this.buildMenu()
this.$electron.ipcRenderer.on('getPicBeds', (event, picBeds) => {
this.picBed = picBeds
this.buildMenu()
})
},
mounted () {
window.addEventListener('mousedown', this.handleMouseDown, false)
window.addEventListener('mousemove', this.handleMouseMove, false)
window.addEventListener('mouseup', this.handleMouseUp, false)
@ -69,6 +73,9 @@ export default {
}
},
methods: {
getPicBeds () {
this.$electron.ipcRenderer.send('getPicBeds')
},
onDrop (e) {
this.dragover = false
this.ipcSendFiles(e.dataTransfer.files)
@ -119,7 +126,7 @@ export default {
this.openUploadWindow()
} else {
let _this = this
const types = picBed.map(item => item.type)
const types = this.picBed.map(item => item.type)
let submenuItem = this.menu.items[1].submenu.items
submenuItem.forEach((item, index) => {
const result = _this.$db.read().get('picBed.current').value() === types[index]
@ -137,7 +144,7 @@ export default {
},
buildMenu () {
const _this = this
const submenu = picBed.map(item => {
const submenu = this.picBed.map(item => {
return {
label: item.name,
type: 'radio',
@ -176,6 +183,7 @@ export default {
},
beforeDestroy () {
this.$electron.ipcRenderer.removeAllListeners('uploadProgress')
this.$electron.ipcRenderer.removeAllListeners('getPicBeds')
window.removeEventListener('mousedown', this.handleMouseDown, false)
window.removeEventListener('mousemove', this.handleMouseMove, false)
window.removeEventListener('mouseup', this.handleMouseUp, false)

View File

@ -251,7 +251,7 @@ export default {
uploadNotification: this.$db.read().get('settings.uploadNotification').value() || false,
miniWindowOntop: this.$db.read().get('settings.miniWindowOntop').value() || false
},
picBed: this.$picBed,
picBed: [],
keyBindingVisible: false,
customLinkVisible: false,
checkUpdateVisible: false,
@ -273,13 +273,20 @@ export default {
}
},
created () {
this.form.showPicBedList = this.picBed.map(item => {
if (item.visible) {
return item.name
}
this.getPicBeds()
this.$electron.ipcRenderer.on('getPicBeds', (event, picBeds) => {
this.picBed = picBeds
this.form.showPicBedList = this.picBed.map(item => {
if (item.visible) {
return item.name
}
})
})
},
methods: {
getPicBeds () {
this.$electron.ipcRenderer.send('getPicBeds')
},
openConfigFile () {
const { app, shell } = this.$electron.remote
const STORE_PATH = app.getPath('userData')
@ -391,6 +398,9 @@ export default {
this.$db.read().set('settings.miniWindowOntop', val).write()
this.$message('需要重启生效')
}
},
beforeDestroy () {
this.$electron.ipcRenderer.removeAllListeners('getPicBeds')
}
}
</script>

View File

@ -3,7 +3,7 @@
<el-row :gutter="16">
<el-col :span="20" :offset="2">
<div class="view-title">
图片上传 - {{ picBed }}
图片上传 - {{ picBedName }}
</div>
<div
id="upload-area"
@ -65,7 +65,8 @@ export default {
showProgress: false,
showError: false,
pasteStyle: '',
picBed: ''
picBed: [],
picBedName: ''
}
},
mounted () {
@ -83,6 +84,11 @@ export default {
this.$electron.ipcRenderer.on('syncPicBed', () => {
this.getDefaultPicBed()
})
this.getPicBeds()
this.$electron.ipcRenderer.on('getPicBeds', (event, picBeds) => {
this.picBed = picBeds
this.getDefaultPicBed()
})
},
watch: {
progress (val) {
@ -100,6 +106,7 @@ export default {
beforeDestroy () {
this.$electron.ipcRenderer.removeAllListeners('uploadProgress')
this.$electron.ipcRenderer.removeAllListeners('syncPicBed')
this.$electron.ipcRenderer.removeAllListeners('getPicBeds')
},
methods: {
onDrop (e) {
@ -136,11 +143,14 @@ export default {
},
getDefaultPicBed () {
const current = this.$db.read().get('picBed.current').value()
this.$picBed.forEach(item => {
this.picBed.forEach(item => {
if (item.type === current) {
this.picBed = item.name
this.picBedName = item.name
}
})
},
getPicBeds () {
this.$electron.ipcRenderer.send('getPicBeds')
}
}
}

View File

@ -3,55 +3,98 @@
<el-row :gutter="16">
<el-col :span="16" :offset="4">
<div class="view-title">
Imgur图床设置
{{ picBedName }}设置
</div>
<el-form
ref="imgur"
label-position="right"
label-width="120px"
:model="form"
size="mini">
<el-form-item
label="设定ClientId"
prop="clientId"
:rules="{
required: true, message: 'ClientId不能为空', trigger: 'blur'
}">
<el-input v-model="form.clientId" placeholder="ClientId" @keyup.native.enter="confirm"></el-input>
</el-form-item>
<el-form-item
label="设定代理"
prop="proxy"
>
<el-input v-model="form.proxy" placeholder="例如http://127.0.0.1:1080" @keyup.native.enter="confirm"></el-input>
</el-form-item>
<config-form
:config="config"
type="uploader"
ref="configForm"
>
<el-form-item>
<el-button-group>
<el-button type="primary" @click="confirm" round>确定</el-button>
<el-button type="primary" @click="handleConfirm" round>确定</el-button>
<el-button type="success" @click="setDefaultPicBed(type)" round :disabled="defaultPicBed === type">设为默认图床</el-button>
</el-button-group>
</el-form-item>
</el-form>
</config-form>
</el-col>
</el-row>
</div>
</template>
<script>
import ConfigForm from '@/components/ConfigForm'
import mixin from '@/utils/ConfirmButtonMixin'
export default {
name: 'OtherPicBed',
mixins: [mixin],
components: {
ConfigForm
},
data () {
return {
type: ''
type: '',
config: [],
picBedName: ''
}
},
beforeRouteEnter (to, from, next) {
next(vm => {
console.log(vm)
vm.type = to.query.type
vm.$electron.ipcRenderer.send('getPicBedConfig', to.query.type)
vm.$electron.ipcRenderer.on('getPicBedConfig', (event, config, name) => {
vm.config = config
vm.picBedName = name
})
})
},
methods: {
async handleConfirm () {
const result = await this.$refs.configForm.validate()
if (result !== false) {
this.$db.read().set(`picBed.${this.type}`, result).write()
const successNotification = new window.Notification('设置结果', {
body: '设置成功'
})
successNotification.onclick = () => {
return true
}
}
},
setDefaultPicBed (type) {
this.$db.read().set('picBed.current', type).write()
this.defaultPicBed = type
this.$electron.ipcRenderer.send('updateDefaultPicBed', type)
const successNotification = new window.Notification('设置默认图床', {
body: '设置成功'
})
successNotification.onclick = () => {
return true
}
}
},
beforeDestroy () {
this.$electron.ipcRenderer.removeAllListeners('getPicBedConfig')
}
}
</script>
<style lang='stylus'>
#others-view
.el-form
label
line-height 22px
padding-bottom 0
color #eee
.el-button-group
width 100%
.el-button
width 50%
.el-input__inner
border-radius 19px
.el-radio-group
margin-left 25px
.el-switch__label
color #eee
&.is-active
color #409EFF
</style>

View File

@ -1,14 +1,13 @@
import db from '~/datastore'
export default {
name: '',
data () {
return {
defaultPicBed: db.read().get('picBed.current').value()
defaultPicBed: this.$db.read().get('picBed.current').value()
}
},
methods: {
setDefaultPicBed (type) {
db.read().set('picBed.current', type).write()
this.$db.read().set('picBed.current', type).write()
this.defaultPicBed = type
this.$electron.ipcRenderer.send('updateDefaultPicBed', type)
const successNotification = new window.Notification('设置默认图床', {