wood/clash-and-dashboard
1
0
Fork 0
mirror of https://github.com/woodchen-ink/clash-and-dashboard.git synced 2025-07-18 14:01:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(rules): add rules fetch data

Browse Source
This commit is contained in:
chs97 2018-10-26 21:27:23 +08:00
parent 824c0a1177
commit 0c93e77bf6
2 changed files with 43 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
src/containers/Rules/index.tsx
View File

@ -3,89 +3,62 @@ import produce from 'immer'
import { translate } from 'react-i18next' import { translate } from 'react-i18next'
import { SortableElement, SortableHandle, arrayMove } from 'react-sortable-hoc' import { SortableElement, SortableHandle, arrayMove } from 'react-sortable-hoc'
import { Header, Icon, Card, Row, Col, Select, Option, Input } from '@components' import { Header, Icon, Card, Row, Col, Select, Option, Input } from '@components'
import { I18nProps, RuleType } from '@models' import { I18nProps, RuleType, Rule, BaseRouterProps } from '@models'
import './style.scss' import './style.scss'
import { storeKeys } from '@lib/createStore'
import { inject } from 'mobx-react'
interface Rule { interface RulesProps extends BaseRouterProps, I18nProps {}
type: RuleType
payload: string
proxy: string
}
interface RulesState { interface RulesState {
rules: Rule[] rules: Rule[]
proxies: { [key: string]: { type: string } } proxies: { [key: string]: { type: string } }
modifiedIndex: number modifiedIndex: number
} }
class Rules extends React.Component<I18nProps, RulesState> { @inject(...storeKeys)
class Rules extends React.Component<RulesProps, RulesState> {
state = { state = {
rules: [ rules: [
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'google.com.hk', proxy: 'HK' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN-SUFFIX'], payload: 'twitter.com', proxy: 'HKG' },
{ type: RuleType['DOMAIN'], payload: 'pornhub.com', proxy: 'HKG' }
], ],
proxies: { proxies: {
DIRECT: { type: 'Direct' },
GLOBAL: { type: 'Selector' },
HKG: { type: 'URLTest' },
HK: { type: 'Shadowsocks' },
SGGGGGGGGGG: { type: 'Vmess' },
REJECT: { type: 'Reject' }
}, },
modifiedIndex: -1 modifiedIndex: -1
} }
async componentDidMount () {
const { config } = this.props
await config.fetchAndParseConfig()
const rules = config.config.rules
const proxies = {
'REJECT': { type: 'Reject' }
}
config.config.proxy.map(p => {
proxies[p.name] = { type: p.type }
})
this.setState({
rules,
proxies
})
}
private saveConfig = async () => {
const { config } = this.props
const { rules } = this.state
config.config.rules = rules
console.log(config)
await config.updateConfig()
}
private handleModifyType = (index, type) => { private handleModifyType = (index, type) => {
const { rules } = this.state const { rules } = this.state
this.setState({ this.setState({
rules: produce(rules, draftState => { rules: produce(rules, draftState => {
draftState[index].type = type draftState[index].type = type
}) })
}, () => {
this.saveConfig()
}) })
} }
@ -96,16 +69,19 @@ class Rules extends React.Component<I18nProps, RulesState> {
rules: produce(rules, draftState => { rules: produce(rules, draftState => {
draftState[index].payload = payload draftState[index].payload = payload
}) })
}, () => {
this.saveConfig()
}) })
} }
private handleModifyProxy = (index, proxy) => { private handleModifyProxy = (index, proxy) => {
const { rules } = this.state const { rules } = this.state
this.setState({ this.setState({
rules: produce(rules, draftState => { rules: produce(rules, draftState => {
draftState[index].proxy = proxy draftState[index].proxy = proxy
}) })
}, () => {
this.saveConfig()
}) })
} }
@ -119,6 +95,8 @@ class Rules extends React.Component<I18nProps, RulesState> {
this.setState({ this.setState({
rules: newRules, rules: newRules,
modifiedIndex: 0 modifiedIndex: 0
}, () => {
this.saveConfig()
}) })
} }
@ -127,6 +105,8 @@ class Rules extends React.Component<I18nProps, RulesState> {
this.setState({ this.setState({
rules: rules.filter((r, idx) => idx !== index) rules: rules.filter((r, idx) => idx !== index)
}, () => {
this.saveConfig()
}) })
} }

3
src/stores/ConfigStore.ts
View File

@ -87,6 +87,7 @@ export class ConfigStore {
async updateConfig () { async updateConfig () {
const { general, proxy, proxyGroup, rules } = this.config const { general, proxy, proxyGroup, rules } = this.config
const externalController = `${general.externalControllerAddr}:${general.externalControllerPort}` const externalController = `${general.externalControllerAddr}:${general.externalControllerPort}`
const Rule = rules.map(r => [r.type, r.payload, r.proxy].join(','))
const proxyGroups = proxyGroup.map(p => ({ const proxyGroups = proxyGroup.map(p => ({
name: p.name, name: p.name,
...p.config ...p.config
@ -102,7 +103,7 @@ export class ConfigStore {
mode: general.mode, mode: general.mode,
Proxy: proxy, Proxy: proxy,
'Proxy Group': proxyGroups, 'Proxy Group': proxyGroups,
Rule: rules Rule
} }
const data = yaml.stringify(config) const data = yaml.stringify(config)
console.log(data) console.log(data)