update
parent
32dcca0847
commit
b5a24297eb
10
package.json
10
package.json
|
@ -2,10 +2,12 @@
|
||||||
"name": "dns-host",
|
"name": "dns-host",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"description": "伪域名解析",
|
"description": "伪域名解析",
|
||||||
"main": "main.js",
|
"main": "src/main.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "electron .",
|
"start": "electron .",
|
||||||
"pack": "electron-builder"
|
"pack": "electron-builder",
|
||||||
|
"pack:mac": "electron-builder --mac",
|
||||||
|
"pack:linux": "electron-builder --linux"
|
||||||
},
|
},
|
||||||
"author": {
|
"author": {
|
||||||
"name": "yutent",
|
"name": "yutent",
|
||||||
|
@ -46,7 +48,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"electron": "^6.0.5",
|
"electron": "^7.1.0",
|
||||||
"electron-builder": "^21.2.0"
|
"electron-builder": "^22.0.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1 @@
|
||||||
|
html{font-size:1vw;width:100%;height:100%}body{position:fixed;left:0;top:0;display:flex;width:100%;height:100%;line-height:1.5;font-size:1.4rem;color:#62778d}.layout-left{display:flex;flex-direction:column;width:18rem;height:64rem;background:#526273}.layout-left wc-scroll{flex:1}.layout-left .domain-list{width:100%}.layout-left .domain-list .item{display:flex;justify-content:flex-end;align-items:center;height:4rem;padding:0 2rem 0 1rem;color:#f3f5fb;cursor:pointer;transition:background .1s ease-in-out}.layout-left .domain-list .item wc-icon{--size:1.2rem;margin:auto -1.5rem auto .5rem;color:#7e909a}.layout-left .domain-list .item:hover,.layout-left .domain-list .item.active{background:#62778d}.layout-left .domain-list .item.active{border-left:0.3rem solid #ffb618}.layout-left .domain-list .item.blank{justify-content:center;cursor:default}.layout-left .domain-list .item.blank:hover{background:none}.layout-left .action{display:flex;align-items:center;height:5rem;padding:0 1rem}.layout-right{flex:1;display:flex;flex-direction:column;background:#f7f8fb}.layout-right .toolbar{display:flex;align-items:center;justify-content:space-between;height:4rem;padding:0 1.5rem;background:#e8ebf4;box-shadow:0 0.2rem 0.5rem rgba(0,0,0,0.1)}.layout-right .toolbar wc-input{width:20rem}.layout-right .main{overflow:hidden;flex:1;display:flex;flex-direction:column;margin:2rem 1rem;padding:0 .5rem;background:#fff}.layout-right .thead{display:flex;align-items:center;justify-content:center;height:4rem;margin-bottom:.8rem;border-bottom:0.1rem solid #e8ebf4;text-align:center}.layout-right .thead span{flex:1}.layout-right .thead .long{flex:1.5}.layout-right wc-scroll{flex:1}.layout-right .record-list{width:100%;line-height:4rem}.layout-right .record-list .item{display:flex;justify-content:center;align-items:center;height:4rem;padding:0 1rem;border-bottom:0.1rem solid #e8ebf4;text-align:center}.layout-right .record-list .item wc-input,.layout-right .record-list .item span,.layout-right .record-list .item section{flex:1}.layout-right .record-list .item .long{flex:1.5}.layout-right .record-list .item section{display:flex;align-items:center;justify-content:center}.layout-right .record-list .item:hover{background:#f3f5fb}.layout-right .record-list .item:last-child{border-bottom:none}.permission-error{position:fixed;left:0;top:0;z-index:102401;display:none;flex-direction:column;align-items:center;width:100%;height:100%;padding:5rem;background:rgba(250,146,146,0.35);-webkit-backdrop-filter:blur(0.5rem);backdrop-filter:blur(0.5rem)}.permission-error pre{font-family:'Courier New', Courier, monospace;font-size:1.6rem;color:#eb3b48}.permission-error fieldset{width:60rem;padding:0 3rem 3rem;border:0.1rem solid #ffb618;border-radius:.8rem}.permission-error fieldset legend{padding:0 1rem;font-size:1.6rem}.permission-error fieldset dt{margin-top:2rem;font-weight:bold}.permission-error fieldset code{display:block;padding:.8rem 1rem;margin-top:.8rem;border-left:0.3rem solid #dae1e9;background:rgba(255,255,255,0.3);font-family:'Courier New', Courier, monospace}.permission-error.show{display:flex}
|
|
@ -0,0 +1,134 @@
|
||||||
|
@charset "UTF-8";
|
||||||
|
/**
|
||||||
|
* {sonist app style}
|
||||||
|
* @authors yutent<yutent@doui.cc>
|
||||||
|
* @date 2018/12/16 17:15:07
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
@import "./var.scss";
|
||||||
|
|
||||||
|
|
||||||
|
html {font-size:1vw;width:100%;height:100%;}
|
||||||
|
body {
|
||||||
|
position:fixed;left:0;top:0;
|
||||||
|
display:flex;
|
||||||
|
width:100%;height:100%;line-height:1.5;
|
||||||
|
font-size:1.4rem;color:nth($cd, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.layout-left {
|
||||||
|
display:flex;flex-direction:column;
|
||||||
|
width:18rem;height:64rem;
|
||||||
|
background:nth($cd, 2);
|
||||||
|
|
||||||
|
wc-scroll {flex:1;}
|
||||||
|
|
||||||
|
.domain-list {
|
||||||
|
width:100%;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
display:flex;justify-content:flex-end;align-items:center;
|
||||||
|
height:4rem;padding:0 2rem 0 1rem;
|
||||||
|
color:nth($cp, 1);cursor:pointer;
|
||||||
|
@include ts(background);
|
||||||
|
|
||||||
|
wc-icon {--size:1.2rem;margin:auto -1.5rem auto .5rem;color:nth($cgr, 3);}
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&.active {background:nth($cd, 1);}
|
||||||
|
&.active {border-left:.3rem solid nth($co, 1);}
|
||||||
|
&.blank {
|
||||||
|
justify-content:center;cursor:default;
|
||||||
|
&:hover {background:none;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.action {
|
||||||
|
display:flex;align-items:center;
|
||||||
|
height:5rem;padding:0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.layout-right {
|
||||||
|
flex:1;display:flex;flex-direction:column;
|
||||||
|
background:#f7f8fb;
|
||||||
|
|
||||||
|
.toolbar {
|
||||||
|
display:flex;align-items:center;justify-content:space-between;
|
||||||
|
height:4rem;padding:0 1.5rem;
|
||||||
|
background:nth($cp, 2);box-shadow:0 .2rem .5rem rgba(0, 0, 0, .1);
|
||||||
|
|
||||||
|
wc-input {width:20rem;}
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
overflow:hidden;
|
||||||
|
flex:1;display:flex;flex-direction:column;margin:2rem 1rem;padding:0 .5rem;
|
||||||
|
background:#fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.thead {
|
||||||
|
display:flex;align-items:center;justify-content:center;
|
||||||
|
height:4rem;margin-bottom:.8rem;
|
||||||
|
border-bottom:.1rem solid nth($cp, 2);text-align:center;
|
||||||
|
|
||||||
|
span {flex:1;}
|
||||||
|
.long {flex:1.5;}
|
||||||
|
}
|
||||||
|
|
||||||
|
wc-scroll {flex:1;}
|
||||||
|
.record-list {
|
||||||
|
width:100%;line-height:4rem;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
display:flex;justify-content:center;align-items:center;
|
||||||
|
height:4rem;padding:0 1rem;
|
||||||
|
border-bottom:.1rem solid nth($cp, 2);text-align:center;
|
||||||
|
|
||||||
|
wc-input,span,section {flex:1;}
|
||||||
|
.long {flex:1.5;}
|
||||||
|
section {display:flex;align-items:center;justify-content:center;}
|
||||||
|
|
||||||
|
&:hover {background:nth($cp, 1);}
|
||||||
|
&:last-child {border-bottom:none;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.permission-error {
|
||||||
|
position:fixed;left:0;top:0;z-index:102401;
|
||||||
|
display:none;flex-direction:column;align-items:center;
|
||||||
|
width:100%;height:100%;padding:5rem;
|
||||||
|
background:rgba(250, 146, 146, .35);
|
||||||
|
backdrop-filter:blur(.5rem);
|
||||||
|
|
||||||
|
pre {font-family:'Courier New', Courier, monospace;font-size:1.6rem;color:nth($cr, 2);}
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
width:60rem;padding:0 3rem 3rem;
|
||||||
|
border:.1rem solid nth($co, 1);border-radius:.8rem;
|
||||||
|
|
||||||
|
legend {padding:0 1rem;font-size:1.6rem;}
|
||||||
|
|
||||||
|
dt {margin-top:2rem;font-weight:bold;}
|
||||||
|
code {
|
||||||
|
display:block;
|
||||||
|
padding:.8rem 1rem;margin-top:.8rem;
|
||||||
|
border-left:.3rem solid nth($cp, 3);
|
||||||
|
background:rgba(255, 255, 255, .3);
|
||||||
|
font-family:'Courier New', Courier, monospace;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.show {display:flex;}
|
||||||
|
}
|
||||||
|
|
|
@ -0,0 +1,15 @@
|
||||||
|
$ct: #3fc2a7 #19b491 #16967a;
|
||||||
|
$cg: #58d68d #2ecc71 #27ae60;
|
||||||
|
$cpp: #ac61ce #9b59b6 #8e44ad;
|
||||||
|
$cb: #66b1ff #409eff #3a8ee6;
|
||||||
|
$cr: #ff5061 #eb3b48 #ce3742;
|
||||||
|
$co: #ffb618 #f39c12 #e67e22;
|
||||||
|
$cp: #f3f5fb #e8ebf4 #dae1e9;
|
||||||
|
$cgr: #aabac3 #90a3ae #7e909a;
|
||||||
|
$cd: #62778d #526273 #425064;
|
||||||
|
|
||||||
|
@mixin ts($c: all, $t: .1s, $m: ease-in-out){
|
||||||
|
transition:$c $t $m;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 6.4 KiB |
|
@ -0,0 +1,97 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-CN">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
|
||||||
|
<title></title>
|
||||||
|
<link href="/lib/css/reset-basic.css" rel="stylesheet">
|
||||||
|
<link href="/css/app.css" rel="stylesheet">
|
||||||
|
<script src="/js/app.js" type="module"></script>
|
||||||
|
</head>
|
||||||
|
<body anot="app" class="do-fn-noselect">
|
||||||
|
|
||||||
|
<div class="layout-left">
|
||||||
|
<wc-scroll>
|
||||||
|
<ul class="domain-list">
|
||||||
|
<li
|
||||||
|
class="item"
|
||||||
|
:class="{active: it === curr}"
|
||||||
|
:for="it in domains"
|
||||||
|
@click="toggleDomain(it)">
|
||||||
|
<span :text="it"></span>
|
||||||
|
<wc-icon is="right"></wc-icon>
|
||||||
|
</li>
|
||||||
|
<li :if="domains.size() < 1" class="item blank">没有域名</li>
|
||||||
|
</ul>
|
||||||
|
</wc-scroll>
|
||||||
|
<section class="action">
|
||||||
|
<wc-button
|
||||||
|
title="新增域名"
|
||||||
|
color="blue"
|
||||||
|
circle icon="plus"
|
||||||
|
@active="addDomain"></wc-button>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layout-right">
|
||||||
|
|
||||||
|
<header class="toolbar">
|
||||||
|
<wc-button icon="plus" color="teal" @active="addRecord">新增记录</wc-button>
|
||||||
|
<wc-button icon="fly" color="blue" @active="save">保存</wc-button>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="main">
|
||||||
|
<header class="thead">
|
||||||
|
<span class="long">主机记录</span>
|
||||||
|
<span>记录类型</span>
|
||||||
|
<span class="long">记录值</span>
|
||||||
|
<span>操作</span>
|
||||||
|
<span>备注</span>
|
||||||
|
</header>
|
||||||
|
<wc-scroll ref="records">
|
||||||
|
<ul class="record-list">
|
||||||
|
<li class="item" :for="it in records">
|
||||||
|
<wc-input autofocus class="long" :duplex="it.record" label="根域请填 @"></wc-input>
|
||||||
|
<span>A</span>
|
||||||
|
<wc-input class="long" :duplex="it.value" label="请填写IP"></wc-input>
|
||||||
|
<section>
|
||||||
|
<wc-switch :duplex="it.enabled"></wc-switch>
|
||||||
|
<wc-button size="mini" color="red" @active="$remove">删除</wc-button>
|
||||||
|
</section>
|
||||||
|
<wc-input :duplex="it.remark"></wc-input>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</wc-scroll>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="permission-error" :if="permissionShow">
|
||||||
|
<pre>
|
||||||
|
/************************************************************/
|
||||||
|
* hosts文件没有写权限 *
|
||||||
|
/************************************************************/
|
||||||
|
</pre>
|
||||||
|
<fieldset>
|
||||||
|
<legend>操作指引</legend>
|
||||||
|
<dl>
|
||||||
|
<dt>MacOS用户</dt>
|
||||||
|
<dd>打开终端, 执行以下命令</dd>
|
||||||
|
<dd><code>sudo chown $USER:admin /etc/hosts</code></dd>
|
||||||
|
|
||||||
|
<dt>Linux用户</dt>
|
||||||
|
<dd>打开终端, 执行以下命令</dd>
|
||||||
|
<dd><code>sudo chown $USER: /etc/hosts</code></dd>
|
||||||
|
|
||||||
|
<dt>完成之后</dt>
|
||||||
|
<dd>点击下面的按钮重新检测.</dd>
|
||||||
|
<dd>
|
||||||
|
<wc-button color="red" size="mini" @active="check">权限检测</wc-button>
|
||||||
|
</dd>
|
||||||
|
</dl>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,86 @@
|
||||||
|
/**
|
||||||
|
* {sonist app}
|
||||||
|
* @author yutent<yutent@doui.cc>
|
||||||
|
* @date 2018/12/16 17:15:57
|
||||||
|
*/
|
||||||
|
|
||||||
|
import '/lib/anot.js'
|
||||||
|
import '/lib/form/button.js'
|
||||||
|
import '/lib/form/input.js'
|
||||||
|
import '/lib/form/switch.js'
|
||||||
|
import layer from '/lib/layer/index.js'
|
||||||
|
|
||||||
|
const log = console.log
|
||||||
|
|
||||||
|
const { remote, ipcRenderer } = require('electron')
|
||||||
|
|
||||||
|
const WIN = remote.getCurrentWindow()
|
||||||
|
|
||||||
|
const $doc = Anot(document)
|
||||||
|
|
||||||
|
Anot({
|
||||||
|
$id: 'app',
|
||||||
|
state: {
|
||||||
|
filter: '',
|
||||||
|
curr: '', //当前选中的域名
|
||||||
|
domains: [],
|
||||||
|
records: [
|
||||||
|
{
|
||||||
|
record: '',
|
||||||
|
value: '',
|
||||||
|
enabled: true,
|
||||||
|
remark: ''
|
||||||
|
}
|
||||||
|
],
|
||||||
|
permissionShow: false
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// this.$refs.preview.show()
|
||||||
|
this.check()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addRecord() {
|
||||||
|
log('---')
|
||||||
|
if (this.curr) {
|
||||||
|
this.records.unshift({
|
||||||
|
record: '',
|
||||||
|
value: '',
|
||||||
|
enabled: true,
|
||||||
|
remark: ''
|
||||||
|
})
|
||||||
|
this.$refs.records.scrollTop = 0
|
||||||
|
} else {
|
||||||
|
layer.toast('请先选择域名')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
addDomain() {
|
||||||
|
layer
|
||||||
|
.prompt('请输入根域名', function(val, done) {
|
||||||
|
if (/^[\w.]+\.[a-z]+$/.test(val)) {
|
||||||
|
done()
|
||||||
|
} else {
|
||||||
|
layer.toast('域名格式错误', 'error')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.then(val => {
|
||||||
|
this.domains.push(val)
|
||||||
|
if (!this.curr) {
|
||||||
|
this.toggleDomain(val)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(Anot.noop)
|
||||||
|
},
|
||||||
|
toggleDomain(name) {
|
||||||
|
this.curr = name
|
||||||
|
},
|
||||||
|
check() {
|
||||||
|
var check = ipcRenderer.sendSync('dns-host', { type: 'check' })
|
||||||
|
|
||||||
|
if (check) {
|
||||||
|
} else {
|
||||||
|
this.permissionShow = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
save() {}
|
||||||
|
}
|
||||||
|
})
|
|
@ -1,7 +1,7 @@
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @authors yutent (yutent@doui.cc)
|
* @authors yutent (yutent@doui.cc)
|
||||||
* @date 2019-09-16 20:52:26
|
* @date 2019-09-27 11:36:21
|
||||||
* @version v2.0.1
|
* @version v2.0.1
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -1,14 +1,273 @@
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @authors yutent (yutent@doui.cc)
|
* @authors yutent (yutent@doui.cc)
|
||||||
* @date 2019-09-16 20:52:26
|
* @date 2019-09-16 10:23:25
|
||||||
* @version v2.0.1
|
* @version v2.0.1
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
'use strict'
|
'use strict'
|
||||||
|
|
||||||
import"../icon/index.js";import{bind,unbind}from"../utils.js";export default class Checkbox extends HTMLElement{static get observedAttributes(){return["label","color","value","checked","readonly","disabled"]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{label:"",color:"",value:[],checked:!1,readonly:!1,disabled:!1},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML="<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{display:inline-block;line-height:1;font-size:14px}:host label{display:flex;justify-content:center;align-items:center;min-width:32px;height:32px;padding:0 5px;line-height:0;user-select:none;-moz-user-select:none;cursor:inherit;color:#7e909a}:host .dot{--size: 18px;padding:2px;margin-right:3px}:host([readonly]){opacity:0.8}:host([disabled]){cursor:not-allowed;opacity:0.6}:host([size='large']){font-size:16px}:host([size='large']) label{height:42px}:host([size='large']) .dot{--size: 22px}:host([size='medium']) label{height:38px}:host([size='medium']) .dot{--size: 20px}:host([size='mini']){font-size:12px}:host([size='mini']) label{height:20px}:host([size='mini']) .dot{--size: 14px}:host([color='red']) label.checked{color:#ff5061}:host([color='red']) label.checked .dot{border-color:#ff5061}:host([color='red']) label.checked .dot::after{background:#ff5061}:host([color='blue']) label.checked{color:#66b1ff}:host([color='blue']) label.checked .dot{border-color:#66b1ff}:host([color='blue']) label.checked .dot::after{background:#66b1ff}:host([color='green']) label.checked{color:#58d68d}:host([color='green']) label.checked .dot{border-color:#58d68d}:host([color='green']) label.checked .dot::after{background:#58d68d}:host([color='teal']) label.checked{color:#3fc2a7}:host([color='teal']) label.checked .dot{border-color:#3fc2a7}:host([color='teal']) label.checked .dot::after{background:#3fc2a7}:host([color='orange']) label.checked{color:#ffb618}:host([color='orange']) label.checked .dot{border-color:#ffb618}:host([color='orange']) label.checked .dot::after{background:#ffb618}:host([color='dark']) label.checked{color:#62778d}:host([color='dark']) label.checked .dot{border-color:#62778d}:host([color='dark']) label.checked .dot::after{background:#62778d}:host([color='purple']) label.checked{color:#ac61ce}:host([color='purple']) label.checked .dot{border-color:#ac61ce}:host([color='purple']) label.checked .dot::after{background:#ac61ce}\n</style> <label> <wc-icon class=\"dot\" is=\"checkbox-off\"></wc-icon> <slot></slot> </label> ",this.__SWITCH__=this.root.lastElementChild,this.__ICO__=this.__SWITCH__.children[0]}get value(){return this.props.value}set value(e){if(!Array.isArray(e))throw TypeError(":duplex指令需要传入一个数组, 当前为: "+typeof e);this.props.value=e,this.checked=this.props.value.includes(this.props.label)}get checked(){return this.props.checked}set checked(e){this.props.checked=!!e;var{value:o,checked:t,label:l,color:r}=this.props;this.__SWITCH__.classList.toggle("checked",t),this.__ICO__.setAttribute("is","checkbox-"+(t?"on":"off"));var c=o.indexOf(l);t?(this.__ICO__.setAttribute("color",r),c<0&&o.push(l)):(this.__ICO__.removeAttribute("color"),~c&&o.splice(c,1))}get readonly(){return this.props.readonly}set readonly(e){var o=typeof e;e!==this.props.readonly&&("boolean"===o&&e||"boolean"!==o?(this.props.readonly=!0,this.setAttribute("readonly","")):(this.props.readonly=!1,this.removeAttribute("readonly")))}get disabled(){return this.props.disabled}set disabled(e){var o=typeof e;e!==this.props.disabled&&("boolean"===o&&e||"boolean"!==o?(this.props.disabled=!0,this.setAttribute("disabled","")):(this.props.disabled=!1,this.removeAttribute("disabled")))}connectedCallback(){this._handlClick=bind(this,"click",e=>{e.preventDefault(),this.disabled||this.readonly||(this.checked=!this.checked,this.dispatchEvent(new CustomEvent("input")))})}disconnectedCallback(){unbind(this,"click",this._handlClick)}attributeChangedCallback(e,o,t){if(null!==t&&o!==t)switch(e){case"label":case"color":this.props[e]=t;break;case"checked":case"readonly":case"disabled":this[e]=!0}}};
|
const log = console.log
|
||||||
|
|
||||||
|
|
||||||
|
import "../icon/index.js"
|
||||||
|
import { bind, unbind } from "../utils.js"
|
||||||
|
|
||||||
|
export default class Checkbox extends HTMLElement {
|
||||||
|
static get observedAttributes() {
|
||||||
|
return ["label","color","value","checked","readonly","disabled"]
|
||||||
|
}
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
|
||||||
|
Object.defineProperty(this, 'root', {
|
||||||
|
value: this.attachShadow({ mode: 'open' }),
|
||||||
|
writable: true,
|
||||||
|
enumerable: false,
|
||||||
|
configurable: true
|
||||||
|
})
|
||||||
|
Object.defineProperty(this, 'props', {
|
||||||
|
value: {
|
||||||
|
label: '',
|
||||||
|
color: '',
|
||||||
|
value: [],
|
||||||
|
checked: false,
|
||||||
|
readonly: false,
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
writable: true,
|
||||||
|
enumerable: false,
|
||||||
|
configurable: true
|
||||||
|
})
|
||||||
|
|
||||||
|
this.root.innerHTML = `<style>* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0; }
|
||||||
|
|
||||||
|
::before,
|
||||||
|
::after {
|
||||||
|
box-sizing: border-box; }
|
||||||
|
|
||||||
|
:host {
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 1;
|
||||||
|
font-size: 14px; }
|
||||||
|
:host label {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
min-width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
padding: 0 5px;
|
||||||
|
line-height: 0;
|
||||||
|
-moz-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
cursor: inherit;
|
||||||
|
color: #7e909a; }
|
||||||
|
:host .dot {
|
||||||
|
--size: 18px;
|
||||||
|
padding: 2px;
|
||||||
|
margin-right: 3px; }
|
||||||
|
|
||||||
|
:host([readonly]) {
|
||||||
|
opacity: 0.8; }
|
||||||
|
|
||||||
|
:host([disabled]) {
|
||||||
|
cursor: not-allowed;
|
||||||
|
opacity: 0.6; }
|
||||||
|
|
||||||
|
:host([size='large']) {
|
||||||
|
font-size: 16px; }
|
||||||
|
:host([size='large']) label {
|
||||||
|
height: 42px; }
|
||||||
|
:host([size='large']) .dot {
|
||||||
|
--size: 22px; }
|
||||||
|
|
||||||
|
:host([size='medium']) label {
|
||||||
|
height: 38px; }
|
||||||
|
|
||||||
|
:host([size='medium']) .dot {
|
||||||
|
--size: 20px; }
|
||||||
|
|
||||||
|
:host([size='mini']) {
|
||||||
|
font-size: 12px; }
|
||||||
|
:host([size='mini']) label {
|
||||||
|
height: 20px; }
|
||||||
|
:host([size='mini']) .dot {
|
||||||
|
--size: 14px; }
|
||||||
|
|
||||||
|
:host([color='red']) label.checked {
|
||||||
|
color: #ff5061; }
|
||||||
|
:host([color='red']) label.checked .dot {
|
||||||
|
border-color: #ff5061; }
|
||||||
|
:host([color='red']) label.checked .dot::after {
|
||||||
|
background: #ff5061; }
|
||||||
|
|
||||||
|
:host([color='blue']) label.checked {
|
||||||
|
color: #66b1ff; }
|
||||||
|
:host([color='blue']) label.checked .dot {
|
||||||
|
border-color: #66b1ff; }
|
||||||
|
:host([color='blue']) label.checked .dot::after {
|
||||||
|
background: #66b1ff; }
|
||||||
|
|
||||||
|
:host([color='green']) label.checked {
|
||||||
|
color: #58d68d; }
|
||||||
|
:host([color='green']) label.checked .dot {
|
||||||
|
border-color: #58d68d; }
|
||||||
|
:host([color='green']) label.checked .dot::after {
|
||||||
|
background: #58d68d; }
|
||||||
|
|
||||||
|
:host([color='teal']) label.checked {
|
||||||
|
color: #3fc2a7; }
|
||||||
|
:host([color='teal']) label.checked .dot {
|
||||||
|
border-color: #3fc2a7; }
|
||||||
|
:host([color='teal']) label.checked .dot::after {
|
||||||
|
background: #3fc2a7; }
|
||||||
|
|
||||||
|
:host([color='orange']) label.checked {
|
||||||
|
color: #ffb618; }
|
||||||
|
:host([color='orange']) label.checked .dot {
|
||||||
|
border-color: #ffb618; }
|
||||||
|
:host([color='orange']) label.checked .dot::after {
|
||||||
|
background: #ffb618; }
|
||||||
|
|
||||||
|
:host([color='dark']) label.checked {
|
||||||
|
color: #62778d; }
|
||||||
|
:host([color='dark']) label.checked .dot {
|
||||||
|
border-color: #62778d; }
|
||||||
|
:host([color='dark']) label.checked .dot::after {
|
||||||
|
background: #62778d; }
|
||||||
|
|
||||||
|
:host([color='purple']) label.checked {
|
||||||
|
color: #ac61ce; }
|
||||||
|
:host([color='purple']) label.checked .dot {
|
||||||
|
border-color: #ac61ce; }
|
||||||
|
:host([color='purple']) label.checked .dot::after {
|
||||||
|
background: #ac61ce; }
|
||||||
|
</style>
|
||||||
|
<label>
|
||||||
|
<wc-icon class="dot" is="checkbox-off"></wc-icon>
|
||||||
|
<slot></slot>
|
||||||
|
</label>
|
||||||
|
`
|
||||||
|
|
||||||
|
|
||||||
|
this.__SWITCH__ = this.root.lastElementChild
|
||||||
|
this.__ICO__ = this.__SWITCH__.children[0]
|
||||||
|
}
|
||||||
|
|
||||||
|
get value() {
|
||||||
|
return this.props.value
|
||||||
|
}
|
||||||
|
|
||||||
|
set value(val) {
|
||||||
|
log(val, this, this.props.label)
|
||||||
|
if (Array.isArray(val)) {
|
||||||
|
this.props.value = val
|
||||||
|
this.checked = this.props.value.includes(this.props.label)
|
||||||
|
} else {
|
||||||
|
console.error('checkbox组件的value必须是数组, 当前为: ' + typeof val)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
get checked() {
|
||||||
|
return this.props.checked
|
||||||
|
}
|
||||||
|
|
||||||
|
set checked(val) {
|
||||||
|
this.props.checked = !!val
|
||||||
|
var { value, checked, label, color } = this.props
|
||||||
|
this.__SWITCH__.classList.toggle('checked', checked)
|
||||||
|
this.__ICO__.setAttribute('is', 'checkbox-' + (checked ? 'on' : 'off'))
|
||||||
|
|
||||||
|
var idx = value.indexOf(label)
|
||||||
|
if (checked) {
|
||||||
|
this.__ICO__.setAttribute('color', color)
|
||||||
|
if (idx < 0) {
|
||||||
|
value.push(label)
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.__ICO__.removeAttribute('color')
|
||||||
|
if (~idx) {
|
||||||
|
value.splice(idx, 1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
get readonly() {
|
||||||
|
return this.props.readonly
|
||||||
|
}
|
||||||
|
|
||||||
|
set readonly(val) {
|
||||||
|
var type = typeof val
|
||||||
|
|
||||||
|
if (val === this.props.readonly) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if ((type === 'boolean' && val) || type !== 'boolean') {
|
||||||
|
this.props.readonly = true
|
||||||
|
this.setAttribute('readonly', '')
|
||||||
|
} else {
|
||||||
|
this.props.readonly = false
|
||||||
|
this.removeAttribute('readonly')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
get disabled() {
|
||||||
|
return this.props.disabled
|
||||||
|
}
|
||||||
|
|
||||||
|
set disabled(val) {
|
||||||
|
var type = typeof val
|
||||||
|
|
||||||
|
if (val === this.props.disabled) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if ((type === 'boolean' && val) || type !== 'boolean') {
|
||||||
|
this.props.disabled = true
|
||||||
|
this.setAttribute('disabled', '')
|
||||||
|
} else {
|
||||||
|
this.props.disabled = false
|
||||||
|
this.removeAttribute('disabled')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
connectedCallback() {
|
||||||
|
this._handlClick = bind(this, 'click', ev => {
|
||||||
|
ev.preventDefault()
|
||||||
|
|
||||||
|
if (!this.disabled && !this.readonly) {
|
||||||
|
this.checked = !this.checked
|
||||||
|
this.dispatchEvent(new CustomEvent('input'))
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
disconnectedCallback() {
|
||||||
|
unbind(this, 'click', this._handlClick)
|
||||||
|
}
|
||||||
|
|
||||||
|
attributeChangedCallback(name, old, val) {
|
||||||
|
if (val === null || old === val) {return}
|
||||||
|
switch (name) {
|
||||||
|
case 'label':
|
||||||
|
case 'color':
|
||||||
|
this.props[name] = val
|
||||||
|
break
|
||||||
|
|
||||||
|
case 'checked':
|
||||||
|
case 'readonly':
|
||||||
|
case 'disabled':
|
||||||
|
this[name] = true
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
if(!customElements.get('wc-checkbox')){
|
if(!customElements.get('wc-checkbox')){
|
||||||
customElements.define('wc-checkbox', Checkbox)
|
customElements.define('wc-checkbox', Checkbox)
|
||||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,15 @@
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* @authors yutent (yutent@doui.cc)
|
||||||
|
* @date 2019-09-27 11:36:21
|
||||||
|
* @version v2.0.1
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
export default class Progress extends HTMLElement{static get observedAttributes(){return["value","max"]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{value:0,max:1},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML="<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{display:flex;align-items:center}:host label{flex:1;height:var(--size, 10px);border-radius:9px;background:#e8ebf4}:host label span{display:block;width:0;height:100%;border-radius:9px;background:#3fc2a7}:host([size='large']) label{height:18px}:host([size='medium']) label{height:14px}:host([size='mini']) label{height:6px}:host([color='red']) label span{background:#ff5061}:host([color='blue']) label span{background:#66b1ff}:host([color='green']) label span{background:#58d68d}:host([color='orange']) label span{background:#ffb618}:host([color='dark']) label span{background:#62778d}:host([color='purple']) label span{background:#ac61ce}\n</style> <label><span></span></label> ",this.__THUMB__=this.root.children[1].lastElementChild}get value(){return this.props.value}set value(e){this.props.value=+e,this.calculate()}calculate(){var{max:e,value:a}=this.props;this.__THUMB__.style.width=`${100*a/e}%`}connectedCallback(){this.calculate()}attributeChangedCallback(e,a,l){if(null!==l&&a!==l)switch(e){case t:var t=+l;(t!=t||t<1)&&(t=1),this.props.max=t,this.calculate();break;case"value":var r=+l;r==r&&(this.props.value=r,this.calculate())}}};
|
||||||
|
|
||||||
|
if(!customElements.get('wc-progress')){
|
||||||
|
customElements.define('wc-progress', Progress)
|
||||||
|
}
|
|
@ -0,0 +1,15 @@
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* @authors yutent (yutent@doui.cc)
|
||||||
|
* @date 2019-09-27 11:36:21
|
||||||
|
* @version v2.0.1
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
import{bind,unbind}from"../utils.js";export default class Radio extends HTMLElement{static get observedAttributes(){return["label","checked","readonly","disabled"]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{label:"",checked:!1,readonly:!1,disabled:!1},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML="<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{display:inline-block;line-height:1;font-size:14px}:host label{display:flex;justify-content:center;align-items:center;min-width:32px;height:32px;padding:0 5px;line-height:0;-moz-user-select:none;user-select:none;white-space:nowrap;cursor:inherit;color:#7e909a}:host label.checked .dot::after{display:block;width:12px;height:12px;border-radius:50%;background:#aabac3;content:''}:host .dot{width:18px;height:18px;padding:2px;margin-right:3px;border:1px solid #aabac3;border-radius:50%;background:#fff}:host([readonly]){opacity:0.8}:host([disabled]){cursor:not-allowed;opacity:0.6}:host([size='large']) label{width:58px;height:32px}:host([size='large']) .dot{width:26px;height:26px}:host([size='medium']) label{width:50px;height:28px}:host([size='medium']) .dot{width:22px;height:22px}:host([size='mini']) label{width:22px;height:14px;padding:2px}:host([size='mini']) .dot{width:10px;height:10px}:host([color='red']) label.checked{color:#ff5061}:host([color='red']) label.checked .dot{border-color:#ff5061}:host([color='red']) label.checked .dot::after{background:#ff5061}:host([color='blue']) label.checked{color:#66b1ff}:host([color='blue']) label.checked .dot{border-color:#66b1ff}:host([color='blue']) label.checked .dot::after{background:#66b1ff}:host([color='green']) label.checked{color:#58d68d}:host([color='green']) label.checked .dot{border-color:#58d68d}:host([color='green']) label.checked .dot::after{background:#58d68d}:host([color='teal']) label.checked{color:#3fc2a7}:host([color='teal']) label.checked .dot{border-color:#3fc2a7}:host([color='teal']) label.checked .dot::after{background:#3fc2a7}:host([color='orange']) label.checked{color:#ffb618}:host([color='orange']) label.checked .dot{border-color:#ffb618}:host([color='orange']) label.checked .dot::after{background:#ffb618}:host([color='dark']) label.checked{color:#62778d}:host([color='dark']) label.checked .dot{border-color:#62778d}:host([color='dark']) label.checked .dot::after{background:#62778d}:host([color='purple']) label.checked{color:#ac61ce}:host([color='purple']) label.checked .dot{border-color:#ac61ce}:host([color='purple']) label.checked .dot::after{background:#ac61ce}\n</style> <label> <span class=\"dot\"></span> <slot></slot> </label> ",this.__SWITCH__=this.root.lastElementChild}get value(){return this.props.label}set value(e){this.checked=this.props.label===e}get checked(){return this.props.checked}set checked(e){this.props.checked=!!e,this.__SWITCH__.classList.toggle("checked",this.props.checked)}get readonly(){return this.props.readonly}set readonly(e){var o=typeof e;e!==this.props.readonly&&("boolean"===o&&e||"boolean"!==o?(this.props.readonly=!0,this.setAttribute("readonly","")):(this.props.readonly=!1,this.removeAttribute("readonly")))}get disabled(){return this.props.disabled}set disabled(e){var o=typeof e;e!==this.props.disabled&&("boolean"===o&&e||"boolean"!==o?(this.props.disabled=!0,this.setAttribute("disabled","")):(this.props.disabled=!1,this.removeAttribute("disabled")))}connectedCallback(){this._handleClick=bind(this,"click",e=>{this.disabled||this.readonly||this.checked||(this.checked=!0,this.dispatchEvent(new CustomEvent("input")))})}disconnectedCallback(){unbind(this,"click",this._handleClick)}attributeChangedCallback(e,o,t){if(null!==t&&o!==t)switch(e){case"label":this.props.label=t;break;case"checked":case"readonly":case"disabled":this[e]=!0}}};
|
||||||
|
|
||||||
|
if(!customElements.get('wc-radio')){
|
||||||
|
customElements.define('wc-radio', Radio)
|
||||||
|
}
|
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,15 @@
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* @authors yutent (yutent@doui.cc)
|
||||||
|
* @date 2019-09-27 11:36:21
|
||||||
|
* @version v2.0.1
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
import{ebind,bind,unbind}from"../utils.js";export default class Star extends HTMLElement{static get observedAttributes(){return["value","text","size","color","allow-half","show-value","starSize","disabled"]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{value:0,text:[],size:"",color:"","allow-half":!1,"show-value":!1,starSize:32,disabled:!1},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML='<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{display:flex;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;font-size:14px;--size: 24px}label{display:flex;align-items:center;line-height:0;cursor:inherit}label wc-icon{margin:0 3px;transition:transform .1s ease-in-out}label wc-icon:hover{transform:scale(1.05)}label span{padding:0 8px;margin:0 3px}:host([size=\'large\']){font-size:16px;--size: 36px}:host([size=\'medium\']){--size: 30px}:host([size=\'mini\']){font-size:12px;--size: 20px}:host([color=\'red\']) label span{color:#ff5061}:host([color=\'teal\']) label span{color:#3fc2a7}:host([color=\'green\']) label span{color:#58d68d}:host([color=\'grey\']) label span{color:#aabac3}:host([color=\'blue\']) label span{color:#66b1ff}:host([color=\'purple\']) label span{color:#ac61ce}:host([color=\'orange\']) label span{color:#ffb618}:host([disabled]){cursor:default;opacity:0.6}:host([disabled]) label wc-icon:hover{transform:none}\n</style> <label> <wc-icon data-idx="0" is="star" color="grey"></wc-icon> <wc-icon data-idx="1" is="star" color="grey"></wc-icon> <wc-icon data-idx="2" is="star" color="grey"></wc-icon> <wc-icon data-idx="3" is="star" color="grey"></wc-icon> <wc-icon data-idx="4" is="star" color="grey"></wc-icon> <span class="text"></span> </label> ',this.__BOX__=this.root.children[1],this.__STARS__=Array.from(this.__BOX__.children),this.__TEXT__=this.__STARS__.pop()}get value(){return this.props.value}set value(e){var t=+e;(e=t==t&&t>0?t:0)>5&&(e=5),this.props.value=e,this._updateDraw(-1)}_updateDraw(e,t=0){var s="star-half",{value:o,tmp:a={i:0,f:0}}=this.props;-1===e&&(e=Math.floor(o),t=+(o%1).toFixed(1),e>0&&e===o&&(e--,t=1)),this.props["allow-half"]||(t=t>0?1:0),e===a.i&&t===a.f||(t>.5&&(s="star-full"),this.__STARS__.forEach((t,s)=>{t.setAttribute("is",s<e?"star-full":"star"),t.setAttribute("color",s<e?this.props.color:"grey")}),t>0&&(this.__STARS__[e].setAttribute("is",s),this.__STARS__[e].setAttribute("color",this.props.color)),this.props.tmp={i:e,f:t},0===e&&0===t?this.__TEXT__.textContent="":5===this.props.text.length?this.__TEXT__.textContent=this.props.text[e]:this.props["show-value"]&&(this.__TEXT__.textContent=e+t))}connectedCallback(){ebind(this.__BOX__,"mousemove",e=>{if(!this.props.disabled&&"WC-ICON"===e.target.tagName){let t=+e.target.dataset.idx;this._updateDraw(t,+(e.offsetX/this.props.starSize).toFixed(1))}}),ebind(this.__BOX__,"click",e=>{var{tmp:t,disabled:s}=this.props;s||"WC-ICON"===e.target.tagName&&(this.props.value=t.i+t.f,this.dispatchEvent(new CustomEvent("input")))}),ebind(this.__BOX__,"mouseleave",e=>{this.props.disabled||this._updateDraw(-1)})}attributeChangedCallback(e,t,s){if(null!==s&&t!==s)switch(e){case"size":this.props.starSize=this.__STARS__[0].clientWidth;break;case"allow-half":case"show-value":case"disabled":this.props[e]=!0;break;case"color":s&&(this.props.color=s);break;case"text":s&&5===(s=s.split("|")).length&&(this.props.text=s.map(e=>e.trim()));break;case"value":this.value=s}}};
|
||||||
|
|
||||||
|
if(!customElements.get('wc-star')){
|
||||||
|
customElements.define('wc-star', Star)
|
||||||
|
}
|
|
@ -1,14 +1,14 @@
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @authors yutent (yutent@doui.cc)
|
* @authors yutent (yutent@doui.cc)
|
||||||
* @date 2019-09-16 20:52:26
|
* @date 2019-09-27 11:36:21
|
||||||
* @version v2.0.1
|
* @version v2.0.1
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
'use strict'
|
'use strict'
|
||||||
|
|
||||||
import{bind,unbind}from"../utils.js";export default class Switch extends HTMLElement{static get observedAttributes(){return["checked","disabled"]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{checked:!1,disabled:!1},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML="<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{display:inline-block}:host section{display:flex;justify-content:center;align-items:center}:host label{display:flex;width:38px;height:22px;padding:3px;margin:5px;line-height:0;border-radius:21px;background:#dae1e9;cursor:inherit}:host label.checked{flex-direction:row-reverse;background:#7e909a}:host .dot{width:16px;height:16px;border-radius:50%;background:#fff}:host([disabled]){cursor:not-allowed;opacity:0.6}:host([size='large']) label{width:58px;height:32px}:host([size='large']) .dot{width:26px;height:26px}:host([size='medium']) label{width:50px;height:28px}:host([size='medium']) .dot{width:22px;height:22px}:host([size='mini']) label{width:22px;height:14px;padding:2px}:host([size='mini']) .dot{width:10px;height:10px}:host([color='red']) label.checked{background:#ff5061}:host([color='blue']) label.checked{background:#66b1ff}:host([color='green']) label.checked{background:#58d68d}:host([color='teal']) label.checked{background:#3fc2a7}:host([color='orange']) label.checked{background:#ffb618}:host([color='dark']) label.checked{background:#62778d}:host([color='purple']) label.checked{background:#ac61ce}\n</style> <section> <label> <span class=\"dot\"></span> </label> <slot></slot> </section> ",this.__SWITCH__=this.root.lastElementChild.firstElementChild}get value(){return this.props.checked}set value(e){this.checked=e}get checked(){return this.props.checked}set checked(e){this.props.checked=!!e,this.__SWITCH__.classList.toggle("checked",this.props.checked)}get disabled(){return this.props.disabled}set disabled(e){var t=typeof e;e!==this.props.disabled&&("boolean"===t&&e||"boolean"!==t?(this.props.disabled=!0,this.setAttribute("disabled","")):(this.props.disabled=!1,this.removeAttribute("disabled")))}connectedCallback(){this._handleClick=bind(this,"click",e=>{this.disabled||(this.checked=!this.checked,this.dispatchEvent(new CustomEvent("input")))})}disconnectedCallback(){unbind(this,"click",this._handleClick)}attributeChangedCallback(e,t,i){if(null!==i&&t!==i)switch(e){case"checked":case"disabled":this[e]=!0}}};
|
import{bind,unbind}from"../utils.js";export default class Switch extends HTMLElement{static get observedAttributes(){return["active-text","inactive-text","checked","disabled"]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{"active-text":null,"inactive-text":null,checked:!1,disabled:!1},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML="<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{display:inline-block}:host section{display:flex;justify-content:center;align-items:center;white-space:nowrap}:host label{display:flex;width:38px;height:22px;padding:3px;margin:5px;line-height:0;border-radius:21px;background:#dae1e9;cursor:inherit}:host label.checked{flex-direction:row-reverse;background:#7e909a}:host .dot{width:16px;height:16px;border-radius:50%;background:#fff}:host([disabled]){cursor:not-allowed;opacity:0.6}:host([size='large']) label{width:58px;height:32px}:host([size='large']) .dot{width:26px;height:26px}:host([size='medium']) label{width:50px;height:28px}:host([size='medium']) .dot{width:22px;height:22px}:host([size='mini']) label{width:22px;height:14px;padding:2px}:host([size='mini']) .dot{width:10px;height:10px}:host([color='red']) label.checked{background:#ff5061}:host([color='blue']) label.checked{background:#66b1ff}:host([color='green']) label.checked{background:#58d68d}:host([color='teal']) label.checked{background:#3fc2a7}:host([color='orange']) label.checked{background:#ffb618}:host([color='dark']) label.checked{background:#62778d}:host([color='purple']) label.checked{background:#ac61ce}\n</style> <section> <label> <span class=\"dot\"></span> </label> <slot></slot> </section> ",this.__SWITCH__=this.root.lastElementChild.firstElementChild}get value(){return this.props.checked}set value(e){this.checked=e}get checked(){return this.props.checked}set checked(e){this.props.checked=!!e,this.__SWITCH__.classList.toggle("checked",this.props.checked)}get disabled(){return this.props.disabled}set disabled(e){var t=typeof e;e!==this.props.disabled&&("boolean"===t&&e||"boolean"!==t?(this.props.disabled=!0,this.setAttribute("disabled","")):(this.props.disabled=!1,this.removeAttribute("disabled")))}connectedCallback(){this._handleClick=bind(this,"click",e=>{this.disabled||(this.checked=!this.checked,this.checked?null!==this.props["active-text"]&&(this.textContent=this.props["active-text"]):null!==this.props["inactive-text"]&&(this.textContent=this.props["inactive-text"]),this.dispatchEvent(new CustomEvent("input")))})}disconnectedCallback(){unbind(this,"click",this._handleClick)}attributeChangedCallback(e,t,i){if(null!==i&&t!==i)switch(e){case"checked":case"disabled":this[e]=!0;break;case"active-text":case"inactive-text":this.props[e]=i+""}}};
|
||||||
|
|
||||||
if(!customElements.get('wc-switch')){
|
if(!customElements.get('wc-switch')){
|
||||||
customElements.define('wc-switch', Switch)
|
customElements.define('wc-switch', Switch)
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @authors yutent (yutent@doui.cc)
|
* @authors yutent (yutent@doui.cc)
|
||||||
* @date 2019-09-16 20:52:26
|
* @date 2019-09-27 11:36:21
|
||||||
* @version v2.0.1
|
* @version v2.0.1
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -1,14 +1,14 @@
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @authors yutent (yutent@doui.cc)
|
* @authors yutent (yutent@doui.cc)
|
||||||
* @date 2019-09-16 20:52:26
|
* @date 2019-09-27 11:36:21
|
||||||
* @version v2.0.1
|
* @version v2.0.1
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
'use strict'
|
'use strict'
|
||||||
|
|
||||||
import{bind,ebind,unbind}from"../utils.js";const IS_FF=!!window.sidebar;export default class Scroll extends HTMLElement{static get observedAttributes(){return[]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML='<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{overflow:hidden;position:relative;display:flex;width:100%}:host .container{overflow:hidden;position:relative;width:100%;height:100%}.is-horizontal,.is-vertical{visibility:hidden;position:absolute;z-index:10240;opacity:0;transition:opacity 0.3s linear, visibility 0.3s linear}.is-horizontal .thumb,.is-vertical .thumb{display:block;border-radius:3px;background:rgba(44,47,53,0.25);cursor:default}.is-horizontal .thumb:hover,.is-vertical .thumb:hover{background:rgba(44,47,53,0.5)}.is-horizontal{left:0;bottom:1px;width:100%;height:6px}.is-horizontal .thumb{width:0;height:6px}.is-vertical{top:0;right:1px;width:6px;height:100%}.is-vertical .thumb{width:6px;height:0}:host(:hover) .is-horizontal,:host(:hover) .is-vertical{visibility:visible;opacity:1}\n</style> <div class="container"><slot></slot></div> <div class="is-horizontal"><span class="thumb"></span></div> <div class="is-vertical"><span class="thumb"></span></div> ',this.__BOX__=this.root.children[1],this.__X__=this.root.children[2].children[0],this.__Y__=this.root.children[3].children[0]}get scrollTop(){return this.__BOX__.scrollTop}set scrollTop(t){if((t=+t)==t){var{sh:s,oh:i,yh:e}=this.props;this.__BOX__.scrollTop=t;var o=this.__BOX__.scrollTop/(s-i)*(i-e);this.props.thumbY=o,this.__Y__.style.transform=`translateY(${o}px)`}}get scrollLeft(){return this.__BOX__.scrollLeft}set scrollLeft(t){if(n=+n,n==n){var{sw:s,ow:i,xw:e}=this.props;this.__BOX__.scrollLeft=n;var o=this.__BOX__.scrollLeft/(s-i)*(i-e);this.props.thumbX=o,this.__X__.style.transform=`translateX(${o}px)`}}get scrollHeight(){return this.__BOX__.scrollHeight}_fetchScrollX(t){var{sw:s,ow:i,xw:e}=this.props;return t<0?t=0:t>i-e&&(t=i-e),this.__BOX__.scrollLeft=t/(i-e)*(s-i),this.__X__.style.transform=`translateX(${t}px)`,t}_fetchScrollY(t){var{sh:s,oh:i,yh:e}=this.props;return t<0?t=0:t>i-e&&(t=i-e),this.__BOX__.scrollTop=t/(i-e)*(s-i),this.__Y__.style.transform=`translateY(${t}px)`,t}connectedCallback(){this._initFn=bind(this.__BOX__,"mouseenter",t=>{var s=this.__BOX__.offsetWidth,i=this.__BOX__.scrollWidth,e=this.__BOX__.offsetHeight,o=this.__BOX__.scrollHeight,r=e*e/o>>0,h=s*s/i>>0;r<50&&(r=50),h<50&&(h=50),h===s&&(h=0),r===e&&(r=0),this.props.oh=e,this.props.sh=o,this.props.ow=s,this.props.sw=i,this.props.yh=r,this.props.xw=h,this.__X__.style.width=h+"px",this.__Y__.style.height=r+"px"}),this._wheelFn=ebind(this.__BOX__,"wheel",t=>{t.preventDefault();var{sh:s,oh:i,yh:e,sw:o,ow:r,xw:h}=this.props;if(h||e){var l,_;if(IS_FF)l=t.deltaMode?10*t.deltaX:t.deltaX,_=t.deltaMode?10*t.deltaY:t.deltaY;else{var n=Math.abs(t.wheelDelta);n<120?(l=t.deltaX,_=t.deltaY):(l=t.deltaX/(n/120),_=t.deltaY/(n/120))}if(this.__BOX__.scrollTop+=_,this.__BOX__.scrollLeft+=l,h){var a=this.__BOX__.scrollLeft/(o-r)*(r-h);this.props.thumbX=a,this.__X__.style.transform=`translateX(${a}px)`}if(e){var p=this.__BOX__.scrollTop/(s-i)*(i-e);this.props.thumbY=p,this.__Y__.style.transform=`translateY(${p}px)`}}});var t,s,i,e,o=o=>{var{thumbY:r,thumbX:h}=this.props;null!==t&&(i=this._fetchScrollX(h+o.pageX-t)),null!==s&&(e=this._fetchScrollY(r+o.pageY-s))},r=h=>{t=null,s=null,this.props.thumbX=i,this.props.thumbY=e,unbind(document,"mousemove",o),unbind(document,"mouseup",r)};bind(this.__Y__,"mousedown",t=>{s=t.pageY,this.props.thumbY||(this.props.thumbY=0),bind(document,"mousemove",o),bind(document,"mouseup",r)}),bind(this.__X__,"mousedown",s=>{t=s.pageX,this.props.thumbX||(this.props.thumbX=0),bind(document,"mousemove",o),bind(document,"mouseup",r)})}disconnectedCallback(){unbind(this.__BOX__,"mouseenter",this._initFn),unbind(this.__BOX__,"wheel",this._wheelFn)}};
|
import{bind,ebind,unbind}from"../utils.js";const IS_FF=!!window.sidebar;export default class Scroll extends HTMLElement{static get observedAttributes(){return[]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML='<style>*{box-sizing:border-box;margin:0;padding:0}::before,::after{box-sizing:border-box}:host{overflow:hidden;position:relative;display:flex;width:100%}:host .container{overflow:hidden;position:relative;width:100%;height:100%}.is-horizontal,.is-vertical{visibility:hidden;position:absolute;z-index:10240;opacity:0;transition:opacity 0.3s linear, visibility 0.3s linear}.is-horizontal .thumb,.is-vertical .thumb{display:block;border-radius:3px;background:rgba(44,47,53,0.25);cursor:default}.is-horizontal .thumb:hover,.is-vertical .thumb:hover{background:rgba(44,47,53,0.5)}.is-horizontal{left:0;bottom:1px;width:100%;height:6px}.is-horizontal .thumb{width:0;height:6px}.is-vertical{top:0;right:1px;width:6px;height:100%}.is-vertical .thumb{width:6px;height:0}:host(:hover) .is-horizontal,:host(:hover) .is-vertical{visibility:visible;opacity:1}\n</style> <div class="container"><slot></slot></div> <div class="is-horizontal"><span class="thumb"></span></div> <div class="is-vertical"><span class="thumb"></span></div> ',this.__BOX__=this.root.children[1],this.__X__=this.root.children[2].children[0],this.__Y__=this.root.children[3].children[0]}get scrollTop(){return this.__BOX__.scrollTop}set scrollTop(t){if((t=+t)==t){var{sh:s,oh:i,yh:e}=this.props;this.__BOX__.scrollTop=t;var o=this.__BOX__.scrollTop/(s-i)*(i-e);this.props.thumbY=o,this.__Y__.style.transform=`translateY(${o}px)`}}get scrollLeft(){return this.__BOX__.scrollLeft}set scrollLeft(t){if(n=+n,n==n){var{sw:s,ow:i,xw:e}=this.props;this.__BOX__.scrollLeft=n;var o=this.__BOX__.scrollLeft/(s-i)*(i-e);this.props.thumbX=o,this.__X__.style.transform=`translateX(${o}px)`}}get scrollHeight(){return this.__BOX__.scrollHeight}_fetchScrollX(t){var{sw:s,ow:i,xw:e}=this.props;return t<0?t=0:t>i-e&&(t=i-e),this.__BOX__.scrollLeft=t/(i-e)*(s-i),this.__X__.style.transform=`translateX(${t}px)`,t}_fetchScrollY(t){var{sh:s,oh:i,yh:e}=this.props;return t<0?t=0:t>i-e&&(t=i-e),this.__BOX__.scrollTop=t/(i-e)*(s-i),this.__Y__.style.transform=`translateY(${t}px)`,t}connectedCallback(){this._initFn=bind(this.__BOX__,"mouseenter",t=>{var s=this.__BOX__.offsetWidth,i=this.__BOX__.scrollWidth,e=this.__BOX__.offsetHeight,o=this.__BOX__.scrollHeight,r=e*e/o>>0,h=s*s/i>>0;r<50&&(r=50),h<50&&(h=50),h===s&&(h=0),r===e&&(r=0),this.props.oh=e,this.props.sh=o,this.props.ow=s,this.props.sw=i,this.props.yh=r,this.props.xw=h,this.__X__.style.width=h+"px",this.__Y__.style.height=r+"px"}),this._wheelFn=ebind(this.__BOX__,"wheel",t=>{t.preventDefault();var{sh:s,oh:i,yh:e,sw:o,ow:r,xw:h}=this.props;if(h||e){var _,l;if(IS_FF)_=t.deltaMode?10*t.deltaX:t.deltaX,l=t.deltaMode?10*t.deltaY:t.deltaY;else{var n=Math.abs(t.wheelDelta);n<120?(_=t.deltaX,l=t.deltaY):(_=t.deltaX/(n/120),l=t.deltaY/(n/120))}if(this.__BOX__.scrollTop+=l,this.__BOX__.scrollLeft+=_,h){var a=this.__BOX__.scrollLeft/(o-r)*(r-h);this.props.thumbX=a,this.__X__.style.transform=`translateX(${a}px)`}if(e){var p=this.__BOX__.scrollTop/(s-i)*(i-e);this.props.thumbY=p,this.__Y__.style.transform=`translateY(${p}px)`}}});var t,s,i,e,o=o=>{var{thumbY:r,thumbX:h}=this.props;null!==t&&(i=this._fetchScrollX(h+o.pageX-t)),null!==s&&(e=this._fetchScrollY(r+o.pageY-s))},r=h=>{t=null,s=null,this.props.thumbX=i,this.props.thumbY=e,unbind(document,"mousemove",o),unbind(document,"mouseup",r)};bind(this.__Y__,"mousedown",t=>{s=t.pageY,this.props.thumbY||(this.props.thumbY=0),bind(document,"mousemove",o),bind(document,"mouseup",r)}),bind(this.__X__,"mousedown",s=>{t=s.pageX,this.props.thumbX||(this.props.thumbX=0),bind(document,"mousemove",o),bind(document,"mouseup",r)}),this.__observer=new MutationObserver(this._initFn),this.__observer.observe(this,{childList:!0,subtree:!0,characterData:!0})}disconnectedCallback(){this.__observer.disconnect(),unbind(this.__BOX__,"mouseenter",this._initFn),unbind(this.__BOX__,"wheel",this._wheelFn)}};
|
||||||
|
|
||||||
if(!customElements.get('wc-scroll')){
|
if(!customElements.get('wc-scroll')){
|
||||||
customElements.define('wc-scroll', Scroll)
|
customElements.define('wc-scroll', Scroll)
|
||||||
|
|
72
src/main.js
72
src/main.js
|
@ -4,4 +4,74 @@
|
||||||
* @date 2019/09/16 20:51:19
|
* @date 2019/09/16 20:51:19
|
||||||
*/
|
*/
|
||||||
|
|
||||||
const { app } = require('electron')
|
const { app, BrowserWindow, protocol, Menu } = require('electron')
|
||||||
|
const path = require('path')
|
||||||
|
const fs = require('iofs')
|
||||||
|
require('./tools/init')
|
||||||
|
const createMenu = require('./tools/menu')
|
||||||
|
const log = console.log
|
||||||
|
const MIME_TYPES = {
|
||||||
|
'.js': 'text/javascript',
|
||||||
|
'.html': 'text/html',
|
||||||
|
'.htm': 'text/plain',
|
||||||
|
'.css': 'text/css',
|
||||||
|
'.jpg': 'image/jpg',
|
||||||
|
'.png': 'image/png',
|
||||||
|
'.gif': 'image/gif',
|
||||||
|
'.svg': 'image/svg+xml',
|
||||||
|
'.ico': 'image/ico'
|
||||||
|
}
|
||||||
|
|
||||||
|
const ROOT = __dirname
|
||||||
|
|
||||||
|
/* ----------------------------------------------------- */
|
||||||
|
app.commandLine.appendSwitch('--lang', 'zh-CN')
|
||||||
|
app.commandLine.appendSwitch('--autoplay-policy', 'no-user-gesture-required')
|
||||||
|
|
||||||
|
protocol.registerSchemesAsPrivileged([
|
||||||
|
{ scheme: 'app', privileges: { secure: true, standard: true } }
|
||||||
|
])
|
||||||
|
|
||||||
|
/* ----------------------------------------------------- */
|
||||||
|
|
||||||
|
// 初始化应用
|
||||||
|
app.once('ready', () => {
|
||||||
|
// 注册协议
|
||||||
|
protocol.registerBufferProtocol('app', (req, cb) => {
|
||||||
|
let file = req.url.replace(/^app:\/\/local\//, '')
|
||||||
|
let ext = path.extname(req.url)
|
||||||
|
let buff = fs.cat(path.resolve(ROOT, file))
|
||||||
|
cb({ data: buff, mimeType: MIME_TYPES[ext] })
|
||||||
|
})
|
||||||
|
|
||||||
|
Menu.setApplicationMenu(null)
|
||||||
|
|
||||||
|
// 创建浏览器窗口
|
||||||
|
let win = new BrowserWindow({
|
||||||
|
title: '伪域名解析',
|
||||||
|
width: 1000,
|
||||||
|
height: 640,
|
||||||
|
resizable: false,
|
||||||
|
maximizable: false,
|
||||||
|
icon: path.resolve(ROOT, './images/app.png'),
|
||||||
|
webPreferences: {
|
||||||
|
webSecurity: false,
|
||||||
|
experimentalFeatures: true,
|
||||||
|
nodeIntegration: true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
win.on('closed', () => {
|
||||||
|
app.exit()
|
||||||
|
win = null
|
||||||
|
})
|
||||||
|
|
||||||
|
win.openDevTools()
|
||||||
|
|
||||||
|
// 然后加载应用的 index.html
|
||||||
|
win.loadURL('app://local/index.html')
|
||||||
|
|
||||||
|
if (process.platform === 'darwin') {
|
||||||
|
createMenu(win)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
|
@ -0,0 +1,77 @@
|
||||||
|
/**
|
||||||
|
* 配置/DB通讯
|
||||||
|
* @author yutent<yutent@doui.cc>
|
||||||
|
* @date 2019/01/26 18:11:26
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
const { app, ipcMain } = require('electron')
|
||||||
|
const fs = require('iofs')
|
||||||
|
const path = require('path')
|
||||||
|
|
||||||
|
const HOST_FILE = path.resolve(app.getPath('userData'), 'host.cache')
|
||||||
|
|
||||||
|
if (!fs.exists(HOST_FILE)) {
|
||||||
|
fs.echo('{}', HOST_FILE)
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ********** 修复环境变量 start *********** */
|
||||||
|
let PATH_SET = new Set()
|
||||||
|
process.env.PATH.split(':').forEach(_ => {
|
||||||
|
PATH_SET.add(_)
|
||||||
|
})
|
||||||
|
PATH_SET.add('/usr/local/bin')
|
||||||
|
PATH_SET.add('/usr/local/sbin')
|
||||||
|
|
||||||
|
process.env.PATH = Array.from(PATH_SET).join(':')
|
||||||
|
PATH_SET = null
|
||||||
|
|
||||||
|
/* ********** 修复环境变量 end *********** */
|
||||||
|
|
||||||
|
var timer = null
|
||||||
|
|
||||||
|
ipcMain.on('dns-host', (ev, conn) => {
|
||||||
|
switch (conn.type) {
|
||||||
|
// 获取指定目录下的文件和目录
|
||||||
|
case 'get':
|
||||||
|
var cache = fs.cat(HOST_FILE)
|
||||||
|
ev.returnValue = JSON.parse(cache)
|
||||||
|
break
|
||||||
|
// 设置应用配置
|
||||||
|
case 'set':
|
||||||
|
clearTimeout(timer)
|
||||||
|
timer = setTimeout(() => {
|
||||||
|
fs.echo(JSON.stringify(conn.data), HOST_FILE)
|
||||||
|
}, 2000)
|
||||||
|
break
|
||||||
|
|
||||||
|
case 'check':
|
||||||
|
try {
|
||||||
|
var stat = fs.echo('', '/etc/hosts', true)
|
||||||
|
ev.returnValue = true
|
||||||
|
} catch (e) {
|
||||||
|
ev.returnValue = false
|
||||||
|
}
|
||||||
|
break
|
||||||
|
|
||||||
|
case 'history':
|
||||||
|
var cache = fs.cat('/etc/hosts').toString()
|
||||||
|
var records = cache.split(/[\n\r]+/)
|
||||||
|
var list = []
|
||||||
|
var dict = {}
|
||||||
|
var tmp = {}
|
||||||
|
records.forEach(str => {
|
||||||
|
str = str.trim()
|
||||||
|
if (/^(#*?)\s*(\d+\.\d+\.\d+\.\d+)\s+(.*)/.test(str)) {
|
||||||
|
list.push({
|
||||||
|
ip: RegExp.$2,
|
||||||
|
domains: RegExp.$3,
|
||||||
|
enabled: !RegExp.$1
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
records = null
|
||||||
|
list.forEach(it => {})
|
||||||
|
}
|
||||||
|
})
|
|
@ -0,0 +1,67 @@
|
||||||
|
/**
|
||||||
|
* 菜单项
|
||||||
|
* @author yutent<yutent@doui.cc>
|
||||||
|
* @date 2019/01/21 20:34:04
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
const { Menu } = require('electron')
|
||||||
|
|
||||||
|
module.exports = function(win) {
|
||||||
|
let menuList = Menu.buildFromTemplate([
|
||||||
|
{
|
||||||
|
label: '伪域名解析',
|
||||||
|
submenu: [
|
||||||
|
{ role: 'about', label: '关于 伪域名解析' },
|
||||||
|
{ type: 'separator' },
|
||||||
|
{ role: 'quit', label: '退出' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
submenu: [
|
||||||
|
{ role: 'undo', label: '撤消重做' },
|
||||||
|
{ role: 'redo', label: '重做' },
|
||||||
|
{ type: 'separator' },
|
||||||
|
{ role: 'cut', label: '剪切' },
|
||||||
|
{ role: 'copy', label: '复制' },
|
||||||
|
{ role: 'paste', label: '粘贴' },
|
||||||
|
{ role: 'selectall', label: '全选' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '显示',
|
||||||
|
submenu: [
|
||||||
|
{ label: '伪域名解析' },
|
||||||
|
{
|
||||||
|
type: 'separator'
|
||||||
|
},
|
||||||
|
{ label: '伪域名解析' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '窗口',
|
||||||
|
submenu: [
|
||||||
|
{
|
||||||
|
role: 'minimize',
|
||||||
|
label: '最小化',
|
||||||
|
click() {
|
||||||
|
win.minimize()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
role: 'help',
|
||||||
|
label: '帮助',
|
||||||
|
submenu: [
|
||||||
|
{
|
||||||
|
label: '官网',
|
||||||
|
click() {}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
])
|
||||||
|
Menu.setApplicationMenu(menuList)
|
||||||
|
}
|
Loading…
Reference in New Issue