platform config配置 todo需要对每项输入进行文字说明
This commit is contained in:
parent
c41b28cb80
commit
c19733a144
|
|
@ -6,10 +6,10 @@ var antd_1 = require("antd");
|
|||
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
|
||||
var TabPane = antd_1.Tabs.TabPane;
|
||||
function TencentAccount(props) {
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem;
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem, addItem = props.addItem;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u817E\u8BAF\u4E91\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, tslib_1.__assign({ tabPosition: 'top', size: 'middle', type: "editable-card", hideAdd: !(accounts.length > 0), onEdit: function (targetKey, action) {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
}
|
||||
else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
|
|
@ -32,10 +32,10 @@ function TencentAccount(props) {
|
|||
} }) }) }))] })) }), 0)) }))] })));
|
||||
}
|
||||
function QiniuAccount(props) {
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem;
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem, addItem = props.addItem;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u4E03\u725B\u4E91\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, tslib_1.__assign({ tabPosition: 'top', size: 'middle', type: "editable-card", hideAdd: !(accounts.length > 0), onEdit: function (targetKey, action) {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
}
|
||||
else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
|
|
@ -51,10 +51,10 @@ function QiniuAccount(props) {
|
|||
} }) }) }))] })) }), 0)) }))] })));
|
||||
}
|
||||
function AliAccount(props) {
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem;
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem, addItem = props.addItem;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u963F\u91CC\u4E91\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, tslib_1.__assign({ tabPosition: 'top', size: 'middle', type: "editable-card", hideAdd: !(accounts.length > 0), onEdit: function (targetKey, action) {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
}
|
||||
else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
|
|
@ -74,10 +74,10 @@ function AliAccount(props) {
|
|||
} }) }) }))] })) }), 0)) }))] })));
|
||||
}
|
||||
function AmapAccount(props) {
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem;
|
||||
var accounts = props.accounts, setValue = props.setValue, removeItem = props.removeItem, addItem = props.addItem;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u9AD8\u5FB7\u4E91\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, tslib_1.__assign({ tabPosition: "top", size: "middle", type: "editable-card", hideAdd: !(accounts.length > 0), onEdit: function (targetKey, action) {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
}
|
||||
else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
|
|
@ -91,6 +91,6 @@ function AmapAccount(props) {
|
|||
function Account(props) {
|
||||
var account = props.account, setValue = props.setValue, removeItem = props.removeItem;
|
||||
var tencent = account.tencent, qiniu = account.qiniu, ali = account.ali, amap = account.amap;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ direction: "vertical", size: "middle", style: { display: 'flex' } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Card, tslib_1.__assign({ className: web_module_less_1.default.tips }, { children: "\u6BCF\u79CD\u4E91\u5382\u5546\u5747\u53EF\u914D\u7F6E\u591A\u4E2A\u5E10\u53F7\uFF0C\u76F8\u5E94\u7684\u670D\u52A1\u6240\u4F7F\u7528\u7684\u5E10\u53F7\u8BF7\u51C6\u786E\u5BF9\u5E94" })) }), (0, jsx_runtime_1.jsx)(TencentAccount, { accounts: tencent || [], setValue: function (path, value) { return setValue("tencent.".concat(path), value); }, removeItem: function (path, index) { return removeItem("tencent", index); } }), (0, jsx_runtime_1.jsx)(QiniuAccount, { accounts: qiniu || [], setValue: function (path, value) { return setValue("qiniu.".concat(path), value); }, removeItem: function (path, index) { return removeItem("qiniu", index); } }), (0, jsx_runtime_1.jsx)(AliAccount, { accounts: ali || [], setValue: function (path, value) { return setValue("ali.".concat(path), value); }, removeItem: function (path, index) { return removeItem("ali", index); } }), (0, jsx_runtime_1.jsx)(AmapAccount, { accounts: amap || [], setValue: function (path, value) { return setValue("amap.".concat(path), value); }, removeItem: function (path, index) { return removeItem("amap", index); } })] })));
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ direction: "vertical", size: "middle", style: { display: 'flex' } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Card, tslib_1.__assign({ className: web_module_less_1.default.tips }, { children: "\u6BCF\u79CD\u4E91\u5382\u5546\u5747\u53EF\u914D\u7F6E\u591A\u4E2A\u5E10\u53F7\uFF0C\u76F8\u5E94\u7684\u670D\u52A1\u6240\u4F7F\u7528\u7684\u5E10\u53F7\u8BF7\u51C6\u786E\u5BF9\u5E94" })) }), (0, jsx_runtime_1.jsx)(TencentAccount, { accounts: tencent || [], setValue: function (path, value) { return setValue("tencent.".concat(path), value); }, removeItem: function (path, index) { return removeItem("tencent", index); }, addItem: function (path, index) { return setValue("amap.".concat(index), {}); } }), (0, jsx_runtime_1.jsx)(QiniuAccount, { accounts: qiniu || [], setValue: function (path, value) { return setValue("qiniu.".concat(path), value); }, removeItem: function (path, index) { return removeItem("qiniu", index); }, addItem: function (path, index) { return setValue("amap.".concat(index), {}); } }), (0, jsx_runtime_1.jsx)(AliAccount, { accounts: ali || [], setValue: function (path, value) { return setValue("ali.".concat(path), value); }, removeItem: function (path, index) { return removeItem("ali", index); }, addItem: function (path, index) { return setValue("amap.".concat(index), {}); } }), (0, jsx_runtime_1.jsx)(AmapAccount, { accounts: amap || [], setValue: function (path, value) { return setValue("amap.".concat(path), value); }, removeItem: function (path, index) { return removeItem("amap", index); }, addItem: function (path, index) { return setValue("amap.".concat(index), {}); } })] })));
|
||||
}
|
||||
exports.default = Account;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
/// <reference types="react" />
|
||||
import { Config } from '../../../../types/Config';
|
||||
export default function Cos(props: {
|
||||
cos: Required<Config>['Cos'];
|
||||
setValue: (path: string, value: any) => void;
|
||||
}): JSX.Element;
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var antd_1 = require("antd");
|
||||
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
|
||||
function QiniuCos(props) {
|
||||
var cos = props.cos, setValue = props.setValue;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u4E03\u725B\u4E91\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, { tabPosition: 'top', size: 'middle', type: "card", items: [
|
||||
{
|
||||
key: '0',
|
||||
label: '配置项',
|
||||
children: ((0, jsx_runtime_1.jsxs)(antd_1.Form, tslib_1.__assign({ colon: true, labelAlign: "left", layout: "vertical", style: { marginTop: 10 } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "accessKey", name: "accessKey" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165accessKey", type: "text", value: cos === null || cos === void 0 ? void 0 : cos.accessKey, onChange: function (e) {
|
||||
return setValue("accessKey", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "bucket", name: "bucket" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165bucket", type: "text", value: cos === null || cos === void 0 ? void 0 : cos.bucket, onChange: function (e) {
|
||||
return setValue("bucket", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "uploadHost", name: "uploadHost" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165uploadHost", type: "text", value: cos === null || cos === void 0 ? void 0 : cos.uploadHost, onChange: function (e) {
|
||||
return setValue("uploadHost", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "domain", name: "domain" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165domain", type: "text", value: cos === null || cos === void 0 ? void 0 : cos.domain, onChange: function (e) {
|
||||
return setValue("domain", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "protocol", name: "protocol" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Select, { mode: "multiple", allowClear: true, style: { width: '100%' }, placeholder: "\u8BF7\u9009\u62E9\u534F\u8BAE", value: cos === null || cos === void 0 ? void 0 : cos.protocol, onChange: function (value) {
|
||||
setValue("protocol", value);
|
||||
}, options: [
|
||||
{
|
||||
label: 'http',
|
||||
value: 'http',
|
||||
},
|
||||
{
|
||||
label: 'https',
|
||||
value: 'https',
|
||||
},
|
||||
] }) }) }))] }))),
|
||||
},
|
||||
] })] })));
|
||||
}
|
||||
function Cos(props) {
|
||||
var cos = props.cos, setValue = props.setValue;
|
||||
var qiniu = cos.qiniu;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ direction: "vertical", size: "middle", style: { display: 'flex' } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Card, tslib_1.__assign({ className: web_module_less_1.default.tips }, { children: "\u6BCF\u79CD\u5747\u53EF\u914D\u7F6E\u4E00\u4E2A\uFF0C\u76F8\u5E94\u7684\u670D\u52A1\u6240\u4F7F\u7528\u7684\u5E10\u53F7\u8BF7\u51C6\u786E\u5BF9\u5E94" })) }), (0, jsx_runtime_1.jsx)(QiniuCos, { cos: qiniu, setValue: function (path, value) { return setValue("qiniu.".concat(path), value); } })] })));
|
||||
}
|
||||
exports.default = Cos;
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
.label {
|
||||
color: var(--oak-text-color-primary);
|
||||
font-size: var(--oak-font-size-headline-medium);
|
||||
line-height: var(--oak-line-height-headline-medium);
|
||||
}
|
||||
|
||||
.tips {
|
||||
color: var(--oak-gray-color-6);
|
||||
font-size: var(--oak-font-size-mark-small);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0px;
|
||||
margin-top:36px;
|
||||
}
|
||||
|
|
@ -22,7 +22,7 @@ exports.default = OakComponent({
|
|||
dirty: false,
|
||||
currentConfig: (0, lodash_1.cloneDeep)(config),
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
setValue: function (path, value) {
|
||||
|
|
@ -70,6 +70,6 @@ exports.default = OakComponent({
|
|||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
/// <reference types="react" />
|
||||
import { Config } from '../../../../types/Config';
|
||||
export default function Cos(props: {
|
||||
live: Required<Config>['Live'];
|
||||
setValue: (path: string, value: any) => void;
|
||||
}): JSX.Element;
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var antd_1 = require("antd");
|
||||
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
|
||||
function Qiniu(props) {
|
||||
var live = props.live, setValue = props.setValue;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u4E03\u725B\u4E91\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, { tabPosition: 'top', size: 'middle', type: "card", items: [
|
||||
{
|
||||
key: '0',
|
||||
label: '配置项',
|
||||
children: ((0, jsx_runtime_1.jsxs)(antd_1.Form, tslib_1.__assign({ colon: true, labelAlign: "left", layout: "vertical", style: { marginTop: 10 } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "accessKey", name: "accessKey" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165accessKey", type: "text", value: live === null || live === void 0 ? void 0 : live.accessKey, onChange: function (e) {
|
||||
return setValue("accessKey", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "hub", name: "hub" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165hub", type: "text", value: live === null || live === void 0 ? void 0 : live.hub, onChange: function (e) {
|
||||
return setValue("hub", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "liveHost", name: "liveHost" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165liveHost", type: "text", value: live === null || live === void 0 ? void 0 : live.liveHost, onChange: function (e) {
|
||||
return setValue("liveHost", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "playDomain", name: "playDomain" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165playDomain", type: "text", value: live === null || live === void 0 ? void 0 : live.playDomain, onChange: function (e) {
|
||||
return setValue("playDomain", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "playBackDomain", name: "playBackDomain" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165playBackDomain", type: "text", value: live === null || live === void 0 ? void 0 : live.playBackDomain, onChange: function (e) {
|
||||
return setValue("playBackDomain", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "playKey", name: "playKey" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165playKey", type: "text", value: live === null || live === void 0 ? void 0 : live.playKey, onChange: function (e) {
|
||||
return setValue("playKey", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "publishDomain", name: "publishDomain" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165publishDomain", type: "text", value: live === null || live === void 0 ? void 0 : live.publishDomain, onChange: function (e) {
|
||||
return setValue("publishDomain", e.target.value);
|
||||
} }) }) })), (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "publishKey", name: "publishKey" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165publishKey", type: "text", value: live === null || live === void 0 ? void 0 : live.publishKey, onChange: function (e) {
|
||||
return setValue("publishKey", e.target.value);
|
||||
} }) }) }))] }))),
|
||||
},
|
||||
] })] })));
|
||||
}
|
||||
function Cos(props) {
|
||||
var live = props.live, setValue = props.setValue;
|
||||
var qiniu = live.qiniu;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ direction: "vertical", size: "middle", style: { display: 'flex' } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Card, tslib_1.__assign({ className: web_module_less_1.default.tips }, { children: "\u6BCF\u79CD\u5747\u53EF\u914D\u7F6E\u4E00\u4E2A\uFF0C\u76F8\u5E94\u7684\u670D\u52A1\u6240\u4F7F\u7528\u7684\u5E10\u53F7\u8BF7\u51C6\u786E\u5BF9\u5E94" })) }), (0, jsx_runtime_1.jsx)(Qiniu, { live: qiniu, setValue: function (path, value) { return setValue("qiniu.".concat(path), value); } })] })));
|
||||
}
|
||||
exports.default = Cos;
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
.label {
|
||||
color: var(--oak-text-color-primary);
|
||||
font-size: var(--oak-font-size-headline-medium);
|
||||
line-height: var(--oak-line-height-headline-medium);
|
||||
}
|
||||
|
||||
.tips {
|
||||
color: var(--oak-gray-color-6);
|
||||
font-size: var(--oak-font-size-mark-small);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0px;
|
||||
margin-top:36px;
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
/// <reference types="react" />
|
||||
import { Config } from '../../../../types/Config';
|
||||
export default function Cos(props: {
|
||||
map: Required<Config>['Map'];
|
||||
setValue: (path: string, value: any) => void;
|
||||
}): JSX.Element;
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var antd_1 = require("antd");
|
||||
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
|
||||
function Qiniu(props) {
|
||||
var map = props.map, setValue = props.setValue;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Col, tslib_1.__assign({ flex: "auto" }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Divider, tslib_1.__assign({ orientation: "left", className: web_module_less_1.default.title }, { children: "\u9AD8\u5FB7\u914D\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Tabs, { tabPosition: 'top', size: 'middle', type: "card", items: [
|
||||
{
|
||||
key: '0',
|
||||
label: '配置项',
|
||||
children: ((0, jsx_runtime_1.jsx)(antd_1.Form, tslib_1.__assign({ colon: true, labelAlign: "left", layout: "vertical", style: { marginTop: 10 } }, { children: (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: "webApiKey", name: "webApiKey" }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: "\u8BF7\u8F93\u5165webApiKey", type: "text", value: map === null || map === void 0 ? void 0 : map.webApiKey, onChange: function (e) {
|
||||
return setValue("webApiKey", e.target.value);
|
||||
} }) }) })) }))),
|
||||
},
|
||||
] })] })));
|
||||
}
|
||||
function Cos(props) {
|
||||
var map = props.map, setValue = props.setValue;
|
||||
var amap = map.amap;
|
||||
return ((0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ direction: "vertical", size: "middle", style: { display: 'flex' } }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Row, { children: (0, jsx_runtime_1.jsx)(antd_1.Card, tslib_1.__assign({ className: web_module_less_1.default.tips }, { children: "\u6BCF\u79CD\u5747\u53EF\u914D\u7F6E\u4E00\u4E2A\uFF0C\u76F8\u5E94\u7684\u670D\u52A1\u6240\u4F7F\u7528\u7684\u5E10\u53F7\u8BF7\u51C6\u786E\u5BF9\u5E94" })) }), (0, jsx_runtime_1.jsx)(Qiniu, { map: amap, setValue: function (path, value) { return setValue("amap.".concat(path), value); } })] })));
|
||||
}
|
||||
exports.default = Cos;
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
.label {
|
||||
color: var(--oak-text-color-primary);
|
||||
font-size: var(--oak-font-size-headline-medium);
|
||||
line-height: var(--oak-line-height-headline-medium);
|
||||
}
|
||||
|
||||
.tips {
|
||||
color: var(--oak-gray-color-6);
|
||||
font-size: var(--oak-font-size-mark-small);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0px;
|
||||
margin-top:36px;
|
||||
}
|
||||
|
|
@ -5,20 +5,47 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|||
var antd_1 = require("antd");
|
||||
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
|
||||
var index_1 = tslib_1.__importDefault(require("./account/index"));
|
||||
var TabPane = antd_1.Tabs.TabPane;
|
||||
var index_2 = tslib_1.__importDefault(require("./cos/index"));
|
||||
var index_3 = tslib_1.__importDefault(require("./map/index"));
|
||||
var index_4 = tslib_1.__importDefault(require("./live/index"));
|
||||
function render() {
|
||||
var _this = this;
|
||||
var _a = this.props, entity = _a.entity, name = _a.name;
|
||||
var _b = this.state, currentConfig = _b.currentConfig, dirty = _b.dirty;
|
||||
var account = currentConfig.Account;
|
||||
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(antd_1.Affix, tslib_1.__assign({ offsetTop: 0 }, { children: (0, jsx_runtime_1.jsx)(antd_1.Alert, { message: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("text", { children: ["\u60A8\u6B63\u5728\u66F4\u65B0", (0, jsx_runtime_1.jsx)(antd_1.Typography.Text, tslib_1.__assign({ keyboard: true, className: web_module_less_1.default.weight }, { children: entity })), "\u5BF9\u8C61", (0, jsx_runtime_1.jsx)(antd_1.Typography.Text, tslib_1.__assign({ keyboard: true, className: web_module_less_1.default.weight }, { children: name })), "\u7684\u914D\u7F6E\uFF0C\u8BF7\u8C28\u614E\u64CD\u4F5C"] }) }), type: "info", showIcon: true, action: (0, jsx_runtime_1.jsxs)(antd_1.Space, { children: [(0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ disabled: !dirty, type: "primary", danger: true, onClick: function () { return _this.resetConfig(); }, style: {
|
||||
var _c = currentConfig, account = _c.Account, cos = _c.Cos, map = _c.Map, live = _c.Live;
|
||||
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(antd_1.Affix, tslib_1.__assign({ offsetTop: 64 }, { children: (0, jsx_runtime_1.jsx)(antd_1.Alert, { message: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("text", { children: ["\u60A8\u6B63\u5728\u66F4\u65B0", (0, jsx_runtime_1.jsx)(antd_1.Typography.Text, tslib_1.__assign({ keyboard: true, className: web_module_less_1.default.weight }, { children: entity })), "\u5BF9\u8C61", (0, jsx_runtime_1.jsx)(antd_1.Typography.Text, tslib_1.__assign({ keyboard: true, className: web_module_less_1.default.weight }, { children: name })), "\u7684\u914D\u7F6E\uFF0C\u8BF7\u8C28\u614E\u64CD\u4F5C"] }) }), type: "info", showIcon: true, action: (0, jsx_runtime_1.jsxs)(antd_1.Space, { children: [(0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ disabled: !dirty, type: "primary", danger: true, onClick: function () { return _this.resetConfig(); }, style: {
|
||||
marginRight: 10,
|
||||
} }, { children: "\u91CD\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ disabled: !dirty, type: "primary", onClick: function () { return _this.updateConfig(); } }, { children: "\u786E\u5B9A" }))] }) }) })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: (0, jsx_runtime_1.jsx)(antd_1.Tabs, tslib_1.__assign({ tabPosition: "left" }, { children: (0, jsx_runtime_1.jsx)(TabPane, tslib_1.__assign({ tab: "\u4E91\u5E73\u53F0\u5E10\u53F7", style: {
|
||||
marginLeft: 20,
|
||||
} }, { children: (0, jsx_runtime_1.jsx)(index_1.default, { account: account || {}, setValue: function (path, value) {
|
||||
return _this.setValue("Account.".concat(path), value);
|
||||
}, removeItem: function (path, index) {
|
||||
return _this.removeItem("Account.".concat(path), index);
|
||||
} }) }), "\u4E91\u5E73\u53F0\u5E10\u53F7") })) }))] }));
|
||||
} }, { children: "\u91CD\u7F6E" })), (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ disabled: !dirty, type: "primary", onClick: function () { return _this.updateConfig(); } }, { children: "\u786E\u5B9A" }))] }) }) })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: web_module_less_1.default.container }, { children: (0, jsx_runtime_1.jsx)(antd_1.Tabs, { tabPosition: "left", items: [
|
||||
{
|
||||
key: '云平台帐号',
|
||||
label: '云平台帐号',
|
||||
children: ((0, jsx_runtime_1.jsx)(index_1.default, { account: account || {}, setValue: function (path, value) {
|
||||
return _this.setValue("Account.".concat(path), value);
|
||||
}, removeItem: function (path, index) {
|
||||
return _this.removeItem("Account.".concat(path), index);
|
||||
} })),
|
||||
},
|
||||
{
|
||||
key: '云存储设置',
|
||||
label: '云存储设置',
|
||||
children: ((0, jsx_runtime_1.jsx)(index_2.default, { cos: cos || {}, setValue: function (path, value) {
|
||||
return _this.setValue("Cos.".concat(path), value);
|
||||
} })),
|
||||
},
|
||||
{
|
||||
key: '直播api设置',
|
||||
label: '直播api设置',
|
||||
children: ((0, jsx_runtime_1.jsx)(index_4.default, { live: live || {}, setValue: function (path, value) {
|
||||
return _this.setValue("Map.".concat(path), value);
|
||||
} })),
|
||||
},
|
||||
{
|
||||
key: '地图api设置',
|
||||
label: '地图api设置',
|
||||
children: ((0, jsx_runtime_1.jsx)(index_3.default, { map: map || {}, setValue: function (path, value) {
|
||||
return _this.setValue("Map.".concat(path), value);
|
||||
} })),
|
||||
},
|
||||
] }) }))] }));
|
||||
}
|
||||
exports.default = render;
|
||||
|
|
|
|||
|
|
@ -19,6 +19,9 @@ export declare type QiniuCosConfig = {
|
|||
domain: string;
|
||||
protocol: string | string[];
|
||||
};
|
||||
export declare type AmapMapConfig = {
|
||||
webApiKey: string;
|
||||
};
|
||||
export declare type AliCloudConfig = {
|
||||
accessKeyId: string;
|
||||
accessKeySecret: string;
|
||||
|
|
@ -64,9 +67,7 @@ export declare type Config = {
|
|||
qiniu?: QiniuLiveConfig;
|
||||
};
|
||||
Map?: {
|
||||
amap?: {
|
||||
webApiKey: string;
|
||||
};
|
||||
amap?: AmapMapConfig;
|
||||
};
|
||||
Sms?: {
|
||||
ali?: AliSmsConfig[];
|
||||
|
|
|
|||
|
|
@ -6,11 +6,12 @@ import { AliCloudConfig, AmapCloudConfig, Config, QiniuCloudConfig, TencentCloud
|
|||
const { TabPane } = Tabs;
|
||||
|
||||
function TencentAccount(props: {
|
||||
accounts: TencentCloudConfig[],
|
||||
setValue: (path: string, value: any) => void
|
||||
removeItem: (path: string, index: number) => void
|
||||
accounts: TencentCloudConfig[];
|
||||
setValue: (path: string, value: any) => void;
|
||||
removeItem: (path: string, index: number) => void;
|
||||
addItem: (path: string, index: number) => void;
|
||||
}) {
|
||||
const { accounts, setValue, removeItem } = props;
|
||||
const { accounts, setValue, removeItem, addItem } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
|
|
@ -23,7 +24,7 @@ function TencentAccount(props: {
|
|||
hideAdd={!(accounts.length > 0)}
|
||||
onEdit={(targetKey: any, action: 'add' | 'remove') => {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
} else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
}
|
||||
|
|
@ -151,11 +152,12 @@ function TencentAccount(props: {
|
|||
}
|
||||
|
||||
function QiniuAccount(props: {
|
||||
accounts: QiniuCloudConfig[],
|
||||
setValue: (path: string, value: any) => void
|
||||
removeItem: (path: string, index: number) => void
|
||||
accounts: QiniuCloudConfig[];
|
||||
setValue: (path: string, value: any) => void;
|
||||
removeItem: (path: string, index: number) => void;
|
||||
addItem: (path: string, index: number) => void;
|
||||
}) {
|
||||
const { accounts, setValue, removeItem } = props;
|
||||
const { accounts, setValue, removeItem, addItem } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
|
|
@ -168,7 +170,7 @@ function QiniuAccount(props: {
|
|||
hideAdd={!(accounts.length > 0)}
|
||||
onEdit={(targetKey: any, action: 'add' | 'remove') => {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
} else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
}
|
||||
|
|
@ -263,11 +265,12 @@ function QiniuAccount(props: {
|
|||
}
|
||||
|
||||
function AliAccount(props: {
|
||||
accounts: AliCloudConfig[],
|
||||
setValue: (path: string, value: any) => void
|
||||
removeItem: (path: string, index: number) => void
|
||||
accounts: AliCloudConfig[];
|
||||
setValue: (path: string, value: any) => void;
|
||||
removeItem: (path: string, index: number) => void;
|
||||
addItem: (path: string, index: number) => void;
|
||||
}) {
|
||||
const { accounts, setValue, removeItem } = props;
|
||||
const { accounts, setValue, removeItem, addItem } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
|
|
@ -280,7 +283,7 @@ function AliAccount(props: {
|
|||
hideAdd={!(accounts.length > 0)}
|
||||
onEdit={(targetKey: any, action: 'add' | 'remove') => {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
} else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
}
|
||||
|
|
@ -415,11 +418,12 @@ function AliAccount(props: {
|
|||
|
||||
|
||||
function AmapAccount(props: {
|
||||
accounts: AmapCloudConfig[],
|
||||
setValue: (path: string, value: any) => void
|
||||
removeItem: (path: string, index: number) => void
|
||||
accounts: AmapCloudConfig[];
|
||||
setValue: (path: string, value: any) => void;
|
||||
removeItem: (path: string, index: number) => void;
|
||||
addItem: (path: string, index: number) => void;
|
||||
}) {
|
||||
const { accounts, setValue, removeItem } = props;
|
||||
const { accounts, setValue, removeItem, addItem } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
|
|
@ -432,7 +436,7 @@ function AmapAccount(props: {
|
|||
hideAdd={!(accounts.length > 0)}
|
||||
onEdit={(targetKey: any, action: 'add' | 'remove') => {
|
||||
if (action === 'add') {
|
||||
//add();
|
||||
addItem('', accounts.length);
|
||||
} else {
|
||||
removeItem('', parseInt(targetKey, 10));
|
||||
}
|
||||
|
|
@ -514,21 +518,25 @@ export default function Account(props: {
|
|||
accounts={tencent || []}
|
||||
setValue={(path, value) => setValue(`tencent.${path}`, value)}
|
||||
removeItem={(path, index) => removeItem(`tencent`, index)}
|
||||
addItem={(path, index) => setValue(`amap.${index}`, {})}
|
||||
/>
|
||||
<QiniuAccount
|
||||
accounts={qiniu || []}
|
||||
setValue={(path, value) => setValue(`qiniu.${path}`, value)}
|
||||
removeItem={(path, index) => removeItem(`qiniu`, index)}
|
||||
addItem={(path, index) => setValue(`amap.${index}`, {})}
|
||||
/>
|
||||
<AliAccount
|
||||
accounts={ali || []}
|
||||
setValue={(path, value) => setValue(`ali.${path}`, value)}
|
||||
removeItem={(path, index) => removeItem(`ali`, index)}
|
||||
addItem={(path, index) => setValue(`amap.${index}`, {})}
|
||||
/>
|
||||
<AmapAccount
|
||||
accounts={amap || []}
|
||||
setValue={(path, value) => setValue(`amap.${path}`, value)}
|
||||
removeItem={(path, index) => removeItem(`amap`, index)}
|
||||
addItem={(path, index) => setValue(`amap.${index}`, {})}
|
||||
/>
|
||||
</Space>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,154 @@
|
|||
import React, { useState } from 'react';
|
||||
import {
|
||||
Tabs,
|
||||
Row,
|
||||
Col,
|
||||
Card,
|
||||
Divider,
|
||||
Input,
|
||||
Form,
|
||||
Space,
|
||||
Select,
|
||||
} from 'antd';
|
||||
import Styles from './web.module.less';
|
||||
import { Config, QiniuCosConfig } from '../../../../types/Config';
|
||||
|
||||
|
||||
function QiniuCos(props: {
|
||||
cos: QiniuCosConfig;
|
||||
setValue: (path: string, value: any) => void;
|
||||
}) {
|
||||
const { cos, setValue } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
七牛云配置
|
||||
</Divider>
|
||||
<Tabs
|
||||
tabPosition={'top'}
|
||||
size={'middle'}
|
||||
type="card"
|
||||
items={[
|
||||
{
|
||||
key: '0',
|
||||
label: '配置项',
|
||||
children: (
|
||||
<Form
|
||||
colon={true}
|
||||
labelAlign="left"
|
||||
layout="vertical"
|
||||
style={{ marginTop: 10 }}
|
||||
>
|
||||
<Form.Item label="accessKey" name="accessKey">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入accessKey"
|
||||
type="text"
|
||||
value={cos?.accessKey}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`accessKey`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="bucket" name="bucket">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入bucket"
|
||||
type="text"
|
||||
value={cos?.bucket}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`bucket`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="uploadHost" name="uploadHost">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入uploadHost"
|
||||
type="text"
|
||||
value={cos?.uploadHost}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`uploadHost`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="domain" name="domain">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入domain"
|
||||
type="text"
|
||||
value={cos?.domain}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`domain`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="protocol" name="protocol">
|
||||
<>
|
||||
<Select
|
||||
mode="multiple"
|
||||
allowClear
|
||||
style={{ width: '100%' }}
|
||||
placeholder="请选择协议"
|
||||
value={cos?.protocol as string[]}
|
||||
onChange={(value: string[]) => {
|
||||
setValue(`protocol`, value);
|
||||
}}
|
||||
options={[
|
||||
{
|
||||
label: 'http',
|
||||
value: 'http',
|
||||
},
|
||||
{
|
||||
label: 'https',
|
||||
value: 'https',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
),
|
||||
},
|
||||
]}
|
||||
></Tabs>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
|
||||
export default function Cos(props: {
|
||||
cos: Required<Config>['Cos'];
|
||||
setValue: (path: string, value: any) => void;
|
||||
}) {
|
||||
const { cos, setValue } = props;
|
||||
const { qiniu } = cos;
|
||||
return (
|
||||
<Space direction="vertical" size="middle" style={{ display: 'flex' }}>
|
||||
<Row>
|
||||
<Card className={Styles.tips}>
|
||||
每种均可配置一个，相应的服务所使用的帐号请准确对应
|
||||
</Card>
|
||||
</Row>
|
||||
<QiniuCos
|
||||
cos={qiniu!}
|
||||
setValue={(path, value) => setValue(`qiniu.${path}`, value)}
|
||||
/>
|
||||
</Space>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
.label {
|
||||
color: var(--oak-text-color-primary);
|
||||
font-size: var(--oak-font-size-headline-medium);
|
||||
line-height: var(--oak-line-height-headline-medium);
|
||||
}
|
||||
|
||||
.tips {
|
||||
color: var(--oak-gray-color-6);
|
||||
font-size: var(--oak-font-size-mark-small);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0px;
|
||||
margin-top:36px;
|
||||
}
|
||||
|
|
@ -21,9 +21,9 @@ export default OakComponent({
|
|||
dirty: false,
|
||||
currentConfig: cloneDeep(config),
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
methods: {
|
||||
setValue(path: string, value: any) {
|
||||
const { currentConfig } = this.state;
|
||||
const newConfig = cloneDeep(currentConfig);
|
||||
|
|
@ -56,12 +56,16 @@ export default OakComponent({
|
|||
async updateConfig() {
|
||||
const { currentConfig } = this.state;
|
||||
const { entity, entityId } = this.props;
|
||||
|
||||
await this.features.config.updateConfig(entity, entityId, currentConfig);
|
||||
|
||||
await this.features.config.updateConfig(
|
||||
entity,
|
||||
entityId,
|
||||
currentConfig
|
||||
);
|
||||
this.setMessage({
|
||||
content: '操作成功',
|
||||
type: 'success',
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,192 @@
|
|||
import React, { useState } from 'react';
|
||||
import {
|
||||
Tabs,
|
||||
Row,
|
||||
Col,
|
||||
Card,
|
||||
Divider,
|
||||
Input,
|
||||
Form,
|
||||
Space,
|
||||
} from 'antd';
|
||||
import Styles from './web.module.less';
|
||||
import { Config, QiniuLiveConfig } from '../../../../types/Config';
|
||||
|
||||
|
||||
function Qiniu(props: {
|
||||
live: QiniuLiveConfig;
|
||||
setValue: (path: string, value: any) => void;
|
||||
}) {
|
||||
const { live, setValue } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
七牛云配置
|
||||
</Divider>
|
||||
<Tabs
|
||||
tabPosition={'top'}
|
||||
size={'middle'}
|
||||
type="card"
|
||||
items={[
|
||||
{
|
||||
key: '0',
|
||||
label: '配置项',
|
||||
children: (
|
||||
<Form
|
||||
colon={true}
|
||||
labelAlign="left"
|
||||
layout="vertical"
|
||||
style={{ marginTop: 10 }}
|
||||
>
|
||||
<Form.Item label="accessKey" name="accessKey">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入accessKey"
|
||||
type="text"
|
||||
value={live?.accessKey}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`accessKey`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="hub" name="hub">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入hub"
|
||||
type="text"
|
||||
value={live?.hub}
|
||||
onChange={(e) =>
|
||||
setValue(`hub`, e.target.value)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="liveHost" name="liveHost">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入liveHost"
|
||||
type="text"
|
||||
value={live?.liveHost}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`liveHost`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="playDomain" name="playDomain">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入playDomain"
|
||||
type="text"
|
||||
value={live?.playDomain}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`playDomain`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="playBackDomain"
|
||||
name="playBackDomain"
|
||||
>
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入playBackDomain"
|
||||
type="text"
|
||||
value={live?.playBackDomain}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`playBackDomain`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="playKey" name="playKey">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入playKey"
|
||||
type="text"
|
||||
value={live?.playKey}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`playKey`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="publishDomain"
|
||||
name="publishDomain"
|
||||
>
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入publishDomain"
|
||||
type="text"
|
||||
value={live?.publishDomain}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`publishDomain`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
<Form.Item label="publishKey" name="publishKey">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入publishKey"
|
||||
type="text"
|
||||
value={live?.publishKey}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`publishKey`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
),
|
||||
},
|
||||
]}
|
||||
></Tabs>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
|
||||
export default function Cos(props: {
|
||||
live: Required<Config>['Live'];
|
||||
setValue: (path: string, value: any) => void;
|
||||
}) {
|
||||
const { live, setValue } = props;
|
||||
const { qiniu } = live;
|
||||
return (
|
||||
<Space direction="vertical" size="middle" style={{ display: 'flex' }}>
|
||||
<Row>
|
||||
<Card className={Styles.tips}>
|
||||
每种均可配置一个，相应的服务所使用的帐号请准确对应
|
||||
</Card>
|
||||
</Row>
|
||||
<Qiniu
|
||||
live={qiniu!}
|
||||
setValue={(path, value) => setValue(`qiniu.${path}`, value)}
|
||||
/>
|
||||
</Space>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
.label {
|
||||
color: var(--oak-text-color-primary);
|
||||
font-size: var(--oak-font-size-headline-medium);
|
||||
line-height: var(--oak-line-height-headline-medium);
|
||||
}
|
||||
|
||||
.tips {
|
||||
color: var(--oak-gray-color-6);
|
||||
font-size: var(--oak-font-size-mark-small);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0px;
|
||||
margin-top:36px;
|
||||
}
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
import React, { useState } from 'react';
|
||||
import {
|
||||
Tabs,
|
||||
Row,
|
||||
Col,
|
||||
Card,
|
||||
Divider,
|
||||
Input,
|
||||
Form,
|
||||
Space,
|
||||
Select,
|
||||
} from 'antd';
|
||||
import Styles from './web.module.less';
|
||||
import { Config, AmapMapConfig } from '../../../../types/Config';
|
||||
|
||||
|
||||
function Qiniu(props: {
|
||||
map: AmapMapConfig;
|
||||
setValue: (path: string, value: any) => void;
|
||||
}) {
|
||||
const { map, setValue } = props;
|
||||
return (
|
||||
<Col flex="auto">
|
||||
<Divider orientation="left" className={Styles.title}>
|
||||
高德配置
|
||||
</Divider>
|
||||
<Tabs
|
||||
tabPosition={'top'}
|
||||
size={'middle'}
|
||||
type="card"
|
||||
items={[
|
||||
{
|
||||
key: '0',
|
||||
label: '配置项',
|
||||
children: (
|
||||
<Form
|
||||
colon={true}
|
||||
labelAlign="left"
|
||||
layout="vertical"
|
||||
style={{ marginTop: 10 }}
|
||||
>
|
||||
<Form.Item label="webApiKey" name="webApiKey">
|
||||
<>
|
||||
<Input
|
||||
placeholder="请输入webApiKey"
|
||||
type="text"
|
||||
value={map?.webApiKey}
|
||||
onChange={(e) =>
|
||||
setValue(
|
||||
`webApiKey`,
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
),
|
||||
},
|
||||
]}
|
||||
></Tabs>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
|
||||
export default function Cos(props: {
|
||||
map: Required<Config>['Map'];
|
||||
setValue: (path: string, value: any) => void;
|
||||
}) {
|
||||
const { map, setValue } = props;
|
||||
const { amap } = map;
|
||||
return (
|
||||
<Space direction="vertical" size="middle" style={{ display: 'flex' }}>
|
||||
<Row>
|
||||
<Card className={Styles.tips}>
|
||||
每种均可配置一个，相应的服务所使用的帐号请准确对应
|
||||
</Card>
|
||||
</Row>
|
||||
<Qiniu
|
||||
map={amap!}
|
||||
setValue={(path, value) => setValue(`amap.${path}`, value)}
|
||||
/>
|
||||
</Space>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
.label {
|
||||
color: var(--oak-text-color-primary);
|
||||
font-size: var(--oak-font-size-headline-medium);
|
||||
line-height: var(--oak-line-height-headline-medium);
|
||||
}
|
||||
|
||||
.tips {
|
||||
color: var(--oak-gray-color-6);
|
||||
font-size: var(--oak-font-size-mark-small);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0px;
|
||||
margin-top:36px;
|
||||
}
|
||||
|
|
@ -2,16 +2,24 @@ import React from 'react';
|
|||
import { Tabs, Button, Alert, Affix , Space, Typography } from 'antd';
|
||||
import Style from './web.module.less';
|
||||
import Account from './account/index';
|
||||
import Cos from './cos/index';
|
||||
import Map from './map/index';
|
||||
import Live from './live/index';
|
||||
|
||||
import { Config } from '../../../types/Config';
|
||||
const { TabPane } = Tabs;
|
||||
|
||||
export default function render(this: any) {
|
||||
const { entity, name } = this.props;
|
||||
const { currentConfig, dirty } = this.state;
|
||||
const { Account: account } = currentConfig as Config;
|
||||
const {
|
||||
Account: account,
|
||||
Cos: cos,
|
||||
Map: map,
|
||||
Live: live,
|
||||
} = currentConfig as Config;
|
||||
return (
|
||||
<>
|
||||
<Affix offsetTop={0}>
|
||||
<Affix offsetTop={64}>
|
||||
<Alert
|
||||
message={
|
||||
<div>
|
||||
|
|
@ -61,25 +69,65 @@ export default function render(this: any) {
|
|||
/>
|
||||
</Affix>
|
||||
<div className={Style.container}>
|
||||
<Tabs tabPosition="left">
|
||||
<TabPane
|
||||
key="云平台帐号"
|
||||
tab="云平台帐号"
|
||||
style={{
|
||||
marginLeft: 20,
|
||||
}}
|
||||
>
|
||||
<Account
|
||||
account={account || {}}
|
||||
setValue={(path, value) =>
|
||||
this.setValue(`Account.${path}`, value)
|
||||
}
|
||||
removeItem={(path, index) =>
|
||||
this.removeItem(`Account.${path}`, index)
|
||||
}
|
||||
/>
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
<Tabs
|
||||
tabPosition="left"
|
||||
items={[
|
||||
{
|
||||
key: '云平台帐号',
|
||||
label: '云平台帐号',
|
||||
children: (
|
||||
<Account
|
||||
account={account || {}}
|
||||
setValue={(path, value) =>
|
||||
this.setValue(`Account.${path}`, value)
|
||||
}
|
||||
removeItem={(path, index) =>
|
||||
this.removeItem(
|
||||
`Account.${path}`,
|
||||
index
|
||||
)
|
||||
}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: '云存储设置',
|
||||
label: '云存储设置',
|
||||
children: (
|
||||
<Cos
|
||||
cos={cos || {}}
|
||||
setValue={(path, value) =>
|
||||
this.setValue(`Cos.${path}`, value)
|
||||
}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: '直播api设置',
|
||||
label: '直播api设置',
|
||||
children: (
|
||||
<Live
|
||||
live={live || {}}
|
||||
setValue={(path, value) =>
|
||||
this.setValue(`Map.${path}`, value)
|
||||
}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: '地图api设置',
|
||||
label: '地图api设置',
|
||||
children: (
|
||||
<Map
|
||||
map={map || {}}
|
||||
setValue={(path, value) =>
|
||||
this.setValue(`Map.${path}`, value)
|
||||
}
|
||||
/>
|
||||
),
|
||||
},
|
||||
]}
|
||||
></Tabs>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -22,6 +22,11 @@ export type QiniuCosConfig = {
|
|||
protocol: string | string[];
|
||||
}
|
||||
|
||||
export type AmapMapConfig = {
|
||||
webApiKey: string;
|
||||
};
|
||||
|
||||
|
||||
export type AliCloudConfig = {
|
||||
accessKeyId: string;
|
||||
accessKeySecret: string;
|
||||
|
|
@ -65,26 +70,24 @@ export type Config = {
|
|||
tencent?: TencentCloudConfig[];
|
||||
qiniu?: QiniuCloudConfig[];
|
||||
amap?: AmapCloudConfig[];
|
||||
},
|
||||
};
|
||||
Cos?: {
|
||||
qiniu?: QiniuCosConfig;
|
||||
};
|
||||
Live?: {
|
||||
qiniu?: QiniuLiveConfig;
|
||||
},
|
||||
};
|
||||
Map?: {
|
||||
amap?: {
|
||||
webApiKey: string;
|
||||
};
|
||||
amap?: AmapMapConfig;
|
||||
};
|
||||
Sms?: {
|
||||
ali?: AliSmsConfig[];
|
||||
tencent?: TencentSmsConfig[];
|
||||
}
|
||||
};
|
||||
App: {
|
||||
qrCodeType?: QrCodeType;
|
||||
qrCodeApplicationId?: string;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export type Origin = 'ali' | 'tencent' | 'qiniu' | 'amap';
|
||||
|
|
|
|||
Loading…
Reference in New Issue