diff --git a/bcs-services/bcs-bscp/ui/src/api/credentials.ts b/bcs-services/bcs-bscp/ui/src/api/credentials.ts index 2726e3f7bb..780b943bea 100644 --- a/bcs-services/bcs-bscp/ui/src/api/credentials.ts +++ b/bcs-services/bcs-bscp/ui/src/api/credentials.ts @@ -16,7 +16,7 @@ export const createCredential = (biz_id: string, params: { memo: string }) => */ export const getCredentialList = ( biz_id: string, - query: { limit: number; start: number; searchKey?: string; enable?: boolean; all?: boolean }, + query: { limit?: number; start: number; searchKey?: string; enable?: boolean; all?: boolean }, ) => http.get(`/config/biz_id/${biz_id}/credentials`, { params: query }).then((res) => res.data); /** diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-pull.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-get.yaml similarity index 86% rename from bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-pull.yaml rename to bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-get.yaml index ba54ca07c1..13e190d6c2 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-pull.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-get.yaml @@ -1,6 +1,6 @@ -### Pull -```c++ +### Get + #include #include #include @@ -12,13 +12,12 @@ int main(int argc, char** argv) // set client options. bscp::core::ClientOptions options; - options.m_feedAddrs.push_back({{ .Bk_Bscp_Variable_FEED_ADDR }}); + options.m_feedAddrs.push_back("{{ .Bk_Bscp_Variable_FEED_ADDR }}"); options.m_token = {{ .Bk_Bscp_Variable_ClientKey }}; options.m_bizID = {{ .Bk_Bscp_Variable_BkBizId }}; - options.m_sideRid = "xx"; // labels. - std::map labels{{{ .Bk_Bscp_Variable_Leabels }}}; + std::map labels{{ .Bk_Bscp_Variable_Leabels }}; options.m_labels = labels; // instantiate client. @@ -66,7 +65,7 @@ int main(int argc, char** argv) std::cout << kv.m_key << "=" << value << std::endl; } - std::cout << "call pull kvs success" << std::endl; + std::cout << "call get kvs success" << std::endl; return 0; } diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-watch.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-watch.yaml index 595c5d6f6c..626f291e22 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-watch.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-c++-watch.yaml @@ -1,6 +1,6 @@ + ### Watch -```c++ #include #include #include @@ -16,13 +16,12 @@ int main(int argc, char** argv) // set client options. bscp::core::ClientOptions options; - options.m_feedAddrs.push_back({{ .Bk_Bscp_Variable_FEED_ADDR }}); + options.m_feedAddrs.push_back("{{ .Bk_Bscp_Variable_FEED_ADDR }}"); options.m_token = {{ .Bk_Bscp_Variable_ClientKey }}; options.m_bizID = {{ .Bk_Bscp_Variable_BkBizId }}; - options.m_sideRid = "xx"; // labels. - std::map labels{{{ .Bk_Bscp_Variable_Leabels }}}; + std::map labels{{ .Bk_Bscp_Variable_Leabels }}; options.m_labels = labels; // instantiate client. @@ -104,4 +103,4 @@ int main(int argc, char** argv) } return 0; -} \ No newline at end of file +} diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-pull.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-get.yaml similarity index 90% rename from bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-pull.yaml rename to bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-get.yaml index c1ebbbd362..3ebcf1c945 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-pull.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-get.yaml @@ -1,8 +1,7 @@ -### Pull +### Get -```golang -// pull kv example for bscp sdk +// get kv example for bscp sdk package main import ( @@ -27,9 +26,7 @@ func main() { var token string = {{ .Bk_Bscp_Variable_ClientKey }} var app string = "{{ .Bk_Bscp_Variable_ServiceName }}" - labels := map[string]string{ - {{ .Bk_Bscp_Variable_Leabels }} - } + labels := map[string]string{{ .Bk_Bscp_Variable_Leabels }} bscp, err := client.New( client.WithFeedAddr(feedAddr), diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-watch.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-watch.yaml index 46974c619b..2a9a9b4586 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-watch.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-go-watch.yaml @@ -1,6 +1,6 @@ + ### Watch -```golang // watch kv example for bscp sdk package main @@ -26,9 +26,7 @@ func main() { var token string = {{ .Bk_Bscp_Variable_ClientKey }} var app string = "{{ .Bk_Bscp_Variable_ServiceName }}" - labels := map[string]string{ - {{ .Bk_Bscp_Variable_Leabels }} - } + labels := map[string]string{{ .Bk_Bscp_Variable_Leabels }} bscp, err := client.New( client.WithFeedAddr(feedAddr), diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-pull.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-get.yaml similarity index 89% rename from bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-pull.yaml rename to bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-get.yaml index 3f27867a9f..27aaa4167a 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-pull.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-get.yaml @@ -1,7 +1,7 @@ -### Pull -```java -package com.example.pull; +### Get + +package com.example.get; import com.tencent.bscp.helper.OptionHelper; import com.tencent.bscp.pojo.AppOption; @@ -26,7 +26,7 @@ public class Main { String feedAddr = "{{ .Bk_Bscp_Variable_FEED_ADDR }}"; Integer biz = {{ .Bk_Bscp_Variable_BkBizId }}; String token = {{ .Bk_Bscp_Variable_ClientKey }}; - String app = {{ .Bk_Bscp_Variable_ServiceName }}; + String app = "{{ .Bk_Bscp_Variable_ServiceName }}"; Map labels = new HashMap<>(); {{ .Bk_Bscp_Variable_Leabels }} @@ -50,10 +50,10 @@ public class Main { bscp.close(); - System.out.println("pull success"); + System.out.println("get success"); } catch (Exception e) { - LOGGER.error("pull bscp kv failed", e); + LOGGER.error("get bscp kv failed", e); System.exit(1); return; } diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-watch.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-watch.yaml index bbbe9b3dcd..81605756e5 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-watch.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-java-watch.yaml @@ -1,6 +1,6 @@ + ### Watch -```java package com.example.watch; import com.tencent.bscp.helper.OptionHelper; @@ -25,7 +25,7 @@ public class Main { String feedAddr = "{{ .Bk_Bscp_Variable_FEED_ADDR }}"; Integer biz = {{ .Bk_Bscp_Variable_BkBizId }}; String token = {{ .Bk_Bscp_Variable_ClientKey }}; - String app = {{ .Bk_Bscp_Variable_ServiceName }}; + String app = "{{ .Bk_Bscp_Variable_ServiceName }}"; Map labels = new HashMap<>(); {{ .Bk_Bscp_Variable_Leabels }} diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-pull.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-get.yaml similarity index 97% rename from bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-pull.yaml rename to bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-get.yaml index 9b76044651..6ba7c22db1 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-pull.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-get.yaml @@ -1,4 +1,5 @@ -### Pull + +### Get from bk_bscp.client import BscpClient @@ -8,11 +9,13 @@ BIZ_ID = {{ .Bk_Bscp_Variable_BkBizId }} APP = "{{ .Bk_Bscp_Variable_ServiceName }}" LABELS = {{ .Bk_Bscp_Variable_Leabels }} + + def main(): with BscpClient(SERVER_ADDRS, TOKEN, BIZ_ID) as client: pair = client.get(APP, "key1", LABELS) print(pair.value) + if __name__ == "__main__": main() - diff --git a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-watch.yaml b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-watch.yaml index 0aab98eee3..951dc215c3 100644 --- a/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-watch.yaml +++ b/bcs-services/bcs-bscp/ui/src/assets/exampleData/kv-python-watch.yaml @@ -1,3 +1,4 @@ + ### Watch import logging @@ -10,6 +11,7 @@ BIZ_ID = {{ .Bk_Bscp_Variable_BkBizId }} APP = "{{ .Bk_Bscp_Variable_ServiceName }}" LABELS = {{ .Bk_Bscp_Variable_Leabels }} + def main(): """Watch a single app.""" with BscpClient(SERVER_ADDRS, TOKEN, BIZ_ID) as client: @@ -19,6 +21,9 @@ def main(): value = client.get(ev.app, key.key) print(f"{key.key}={value}") + + + def setup_logger(): """Set up the logger to print logs.""" logger = logging.getLogger("bk_bscp") @@ -29,8 +34,9 @@ def setup_logger(): handler.setFormatter(formatter) logger.addHandler(handler) + setup_logger() + if __name__ == "__main__": main() -``` \ No newline at end of file diff --git a/bcs-services/bcs-bscp/ui/src/i18n/en-us.ts b/bcs-services/bcs-bscp/ui/src/i18n/en-us.ts index 3d8913d158..43da0fc81d 100644 --- a/bcs-services/bcs-bscp/ui/src/i18n/en-us.ts +++ b/bcs-services/bcs-bscp/ui/src/i18n/en-us.ts @@ -713,12 +713,12 @@ export default { 示例参数: 'Example Params', 示例预览: 'Example Preview', 复制示例: 'Example Copy', - '与分组结合使用,实现服务实例的灰度发布场景,支持多个标签;若不需要灰度发布功能,此参数可不配置': 'It can be used in combination with grouping to realize grayscale publishing scenario of service instances and support multiple labels. If the gray scale publishing function is not required, this parameter can not be configured', - 用于客户端拉取配置时身份验证: 'Used for authentication when the client pulls the configuration', - // Get方法: 'Get', - // Watch方法: 'Watch', - 'Pull:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。': 'Method: Pull the latest configuration information at one time. This method is applicable to the scenario where the configuration needs to be obtained and updated.', - 'Watch:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。': 'Watch method: Establish a long connection to monitor changes in the configuration version in real time. When the new configuration version is released, the callback method is automatically invoked to process the new configuration information. This method is applicable to scenarios that require real-time response to configuration changes.', + '与分组结合使用,实现服务实例的灰度发布场景,支持多个标签;若不需要灰度发布功能,此参数可不配置': 'It can be used in combination with grouping to realize grayscale publishing scenario of \n service instances and support multiple labels. \n If the gray scale publishing function is not required, this parameter can not be configured', + '用于客户端拉取配置时身份验证,下拉列表只会展示关联过此服务且状态为启用的密钥': 'Used for client-side authentication when fetching configurations, \n the dropdown list will only display keys that have been associated \n with this service and are in the enabled state', + Get方法: 'Get', + Watch方法: 'Watch', + 'Get方法:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。': 'Get method: Used for fetching the latest configuration information in a single request, suitable for scenarios requiring both retrieval and update of configurations', + 'Watch方法:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。': 'Watch method: Establish a long connection to monitor changes in the configuration version in real time. When the new configuration version is released, the callback method is automatically invoked to process the new configuration information. This method is applicable to scenarios that require real-time response to configuration changes.', 节点管理插件客户端需要在: 'Node management plug-in client needs to be in', 节点管理平台: 'Node management platform', '部署“bkbscp (bscp服务配置分发和热更新)”插件,部署详情请参考产品白皮书:': 'Deploy the bkbscp (bscp Service Configuration Distribution and Hot Update) plug-in. For details, see the product white paper:', @@ -748,6 +748,7 @@ export default { '获取指定服务下指定配置项元数据,支持多个配置项元数据获取,没有指定配置项,获取服务下所有配置项的元数据': 'Obtain the metadata of the specified configuration item of the specified service. You can obtain the metadata of multiple configuration items. Obtain the metadata of all configuration items of the service if no configuration item is specified', '暂无可用密钥,可前往密钥管理新建/启用密钥,或将已有密钥关联至此服务': 'No available keys found. You can go to key management to create/enable a key or associate an existing key with this service', '搜索结果为空,可前往密钥管理新建/启用密钥,或将已有密钥关联至此服务': 'Search result is empty. You can go to key management to create/enable a key or associate an existing key with this service', + 禁止使用系统目录: 'Prohibited from using system directories', // 公共组件 页面不存在: 'Page does not exist', diff --git a/bcs-services/bcs-bscp/ui/src/i18n/zh-cn.ts b/bcs-services/bcs-bscp/ui/src/i18n/zh-cn.ts index 4ca355275d..97649b4511 100644 --- a/bcs-services/bcs-bscp/ui/src/i18n/zh-cn.ts +++ b/bcs-services/bcs-bscp/ui/src/i18n/zh-cn.ts @@ -719,12 +719,12 @@ export default { 示例参数: '示例参数', 示例预览: '示例预览', 复制示例: '复制示例', - '与分组结合使用,实现服务实例的灰度发布场景,支持多个标签;若不需要灰度发布功能,此参数可不配置': 'It can be used in combination with grouping to realize grayscale publishing scenario of service instances and support multiple labels. If the gray scale publishing function is not required, this parameter can not be configured', - 用于客户端拉取配置时身份验证: '用于客户端拉取配置时身份验证', - // Get方法: 'Get方法', - // Watch方法: 'Watch方法', - 'Pull:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。': 'Get 方法:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。', - 'Watch:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。': 'Watch 方法:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。', + '与分组结合使用,实现服务实例的灰度发布场景,支持多个标签;若不需要灰度发布功能,此参数可不配置': '与分组结合使用,实现服务实例的灰度发布场景,支持多个标签;若不需要灰度发布功能,此参数可不配置', + '用于客户端拉取配置时身份验证,下拉列表只会展示关联过此服务且状态为启用的密钥': '用于客户端拉取配置时身份验证,下拉列表只会展示关联过此服务且状态为启用的密钥', + Get方法: 'Get方法', + Watch方法: 'Watch方法', + 'Get方法:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。': 'Get 方法:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。', + 'Watch方法:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。': 'Watch 方法:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。', 节点管理插件客户端需要在: '节点管理插件客户端需要在', 节点管理平台: '节点管理平台', '部署“bkbscp (bscp服务配置分发和热更新)”插件,部署详情请参考产品白皮书:': '部署“bkbscp (bscp服务配置分发和热更新)”插件,部署详情请参考产品白皮书:', @@ -754,6 +754,7 @@ export default { '获取指定服务下指定配置项元数据,支持多个配置项元数据获取,没有指定配置项,获取服务下所有配置项的元数据': '获取指定服务下指定配置项元数据,支持多个配置项元数据获取,没有指定配置项,获取服务下所有配置项的元数据', '暂无可用密钥,可前往密钥管理新建/启用密钥,或将已有密钥关联至此服务': '暂无可用密钥,可前往密钥管理新建/启用密钥,或将已有密钥关联至此服务', '搜索结果为空,可前往密钥管理新建/启用密钥,或将已有密钥关联至此服务': '搜索结果为空,可前往密钥管理新建/启用密钥,或将已有密钥关联至此服务', + 禁止使用系统目录: '禁止使用系统目录', // 公共组件 页面不存在: '页面不存在', diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/add-label.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/add-label.vue index 0ac21a3abc..ceef4ffe1e 100644 --- a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/add-label.vue +++ b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/add-label.vue @@ -76,7 +76,7 @@ } .icon-info { margin-left: 9px; - color: #63656e; + color: #979ba5; cursor: pointer; } .add-label-button { @@ -126,6 +126,12 @@ border: 1px solid #979ba5; border-radius: 50%; cursor: pointer; + &:hover { + border-color: #3a84ff; + &::after { + border-color: #3a84ff; + } + } &::after { content: ''; position: absolute; diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/kv-example.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/kv-example.vue index 2d95a91a2d..e455a8f3b9 100644 --- a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/kv-example.vue +++ b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/kv-example.vue @@ -50,13 +50,13 @@ const route = useRoute(); const tabArr = [ { - name: 'Pull', - topTip: t('Pull:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。'), + name: t('Get方法'), + topTip: t('Get方法:用于一次性拉取最新的配置信息,适用于需要获取并更新配置的场景。'), }, { - name: 'Watch', + name: t('Watch方法'), topTip: t( - 'Watch:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。', + 'Watch方法:通过建立长连接,实时监听配置版本的变更,当新版本的配置发布时,将自动调用回调方法处理新的配置信息,适用于需要实时响应配置变更的场景。', ), }, ]; @@ -85,23 +85,13 @@ const topTip = computed(() => { return tabArr[activeTab.value].topTip; }); - const labelArrShowType = computed(() => { - switch (props.kvName) { - case 'java': - return optionData.value.labelArrType; - default: - return `{${optionData.value.labelArrType}}`; - } - }); watch( () => props.kvName, (newV) => { if (newV !== 'kv-cmd') { handleTab(); - if (['java', 'c++'].includes(newV)) { - getOptionData(optionData.value); - } + getOptionData(optionData.value); // 每次切换模板需重新展示数据方式 } }, ); @@ -128,11 +118,26 @@ labelArrType, }; break; + case 'c++': + if (data.labelArr.length) { + labelArrType = data.labelArr + .map((item: string, index: number) => { + console.log(item); + const [key, value] = item.split(':'); + return `{${key}, ${value}}${index + 1 === data.labelArr.length ? '' : ', '}`; + }) + .join(''); + } + optionData.value = { + ...data, + labelArrType: `{${labelArrType}}`, + }; + break; default: labelArrType = data.labelArr.length ? data.labelArr.join(', ') : ''; optionData.value = { ...data, - labelArrType, + labelArrType: `{${labelArrType}}`, }; break; } @@ -154,7 +159,7 @@ { name: 'Bk_Bscp_Variable_Leabels', type: '', - default_val: labelArrShowType.value, + default_val: optionData.value.labelArrType, memo: '', }, { @@ -197,25 +202,25 @@ /** * * @param kvName 数据模板名称 - * @param methods 方法,0: pull,1: watch + * @param methods 方法,0: get,1: watch */ const changeKvData = (kvName = 'python', methods = 0) => { switch (kvName) { case 'python': return !methods - ? import('/src/assets/exampleData/kv-python-pull.yaml?raw') + ? import('/src/assets/exampleData/kv-python-get.yaml?raw') : import('/src/assets/exampleData/kv-python-watch.yaml?raw'); case 'go': return !methods - ? import('/src/assets/exampleData/kv-go-pull.yaml?raw') + ? import('/src/assets/exampleData/kv-go-get.yaml?raw') : import('/src/assets/exampleData/kv-go-watch.yaml?raw'); case 'java': return !methods - ? import('/src/assets/exampleData/kv-java-pull.yaml?raw') + ? import('/src/assets/exampleData/kv-java-get.yaml?raw') : import('/src/assets/exampleData/kv-java-watch.yaml?raw'); case 'c++': return !methods - ? import('/src/assets/exampleData/kv-c++-pull.yaml?raw') + ? import('/src/assets/exampleData/kv-c++-get.yaml?raw') : import('/src/assets/exampleData/kv-c++-watch.yaml?raw'); default: return ''; diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/node-mana-example.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/node-mana-example.vue index 3ea5e4e1b5..59f912616e 100644 --- a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/node-mana-example.vue +++ b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/content/node-mana-example.vue @@ -2,10 +2,12 @@
{{ $t('节点管理插件客户端需要在') }} - {{ $t('节点管理平台') }} + + {{ $t('节点管理平台') }} + {{ $t('部署“bkbscp (bscp服务配置分发和热更新)”插件,部署详情请参考产品白皮书:') }} - {{ $t('《客户端配置》-“节点管理插件客户端拉取配置”章节') }} + {{ $t('《客户端配置》-“节点管理插件客户端拉取配置”章节') }}
@@ -92,6 +94,10 @@ color: #3a84ff; cursor: pointer; } + .tip-icon-share { + margin: -1px 4px 0; + vertical-align: middle; + } } .preview-content { margin-top: 17px; @@ -113,8 +119,9 @@ .service-item { display: flex; justify-content: flex-start; - align-items: center; + align-items: flex-start; .item-label { + flex-shrink: 0; width: 60px; font-size: 12px; white-space: nowrap; diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/form-option.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/form-option.vue index 817cf652a3..697b2862c8 100644 --- a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/form-option.vue +++ b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/form-option.vue @@ -7,7 +7,7 @@ @@ -53,13 +53,27 @@ const emits = defineEmits(['update-option-data']); const { t } = useI18n(); + const sysDirectories: string[] = [ + '/bin/', + '/boot/', + '/dev/', + '/etc/', + '/lib/', + '/lib64/', + '/proc/', + '/run/', + '/sbin/', + '/sys/', + '/tmp/', + '/usr/', + '/var/', + ]; const rules = { clientKey: [ { required: true, message: t('请先选择客户端密钥,替换下方示例代码后,再尝试复制示例'), validator: (value: string) => value.length, - trigger: 'change', }, ], tempDir: [ @@ -69,10 +83,38 @@ validator: (value: string) => value.length, trigger: 'change', }, + { + required: props.directoryShow, + validator: (value: string) => { + // 必须为绝对路径, 且不能以/结尾 + if (!value.startsWith('/') || value.endsWith('/')) { + return false; + } + const parts = value.split('/').slice(1); + let isValid = true; + // 文件路径校验 + parts.some((part) => { + if (part.startsWith('.') || !/^[\u4e00-\u9fa5A-Za-z0-9.\-_#%,@^+=\\[\]{}]+$/.test(part)) { + isValid = false; + return true; + } + return false; + }); + return isValid; + }, + trigger: 'change', + message: t('无效的路径,路径不符合Unix文件路径格式规范'), + }, + { + required: props.directoryShow, + message: t('禁止使用系统目录'), + validator: (value: string) => !sysDirectories.some((dir) => value.startsWith(dir)), + trigger: 'change', + }, ], }; - const formRef = ref(''); + const formRef = ref(); const formData = ref({ clientKey: '', // 客户端密钥 privacyCredential: '', // 脱敏的密钥 @@ -85,6 +127,9 @@ }); const setCredential = (key: string, privacyKey: string) => { + if (key.length && privacyKey.length) { + formRef.value.clearValidate(); + } formData.value.clientKey = key; formData.value.privacyCredential = privacyKey; }; @@ -124,6 +169,7 @@ top: 50%; transform: translateY(-50%); font-size: 14px; + color: #979ba5; cursor: pointer; } diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/key-selector.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/key-selector.vue index dc49eb5610..db5f6e42ee 100644 --- a/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/key-selector.vue +++ b/bcs-services/bcs-bscp/ui/src/views/space/client/example/components/key-selector.vue @@ -70,6 +70,7 @@ const router = useRouter(); const formError = inject>('formError'); + const serviceName = inject>('serviceName'); const isError = ref(false); const loading = ref(true); const currentValue = ref({ @@ -89,6 +90,16 @@ } }, ); + watch( + () => serviceName!.value, + () => { + (Object.keys(currentValue.value) as Array).forEach((key) => { + currentValue.value[key] = ''; + }); + emits('current-key', '', ''); + loadCredentialList(); + }, + ); onMounted(() => { loadCredentialList(); @@ -100,17 +111,24 @@ try { const query = { start: 0, - // limit: 20, all: true, }; const res = await getCredentialList(bizId.value, query); - credentialList.value = dataMasking(res.details); + const filterCurServiceData = filterCurService(res.details); + credentialList.value = dataMasking(filterCurServiceData); } catch (e) { console.error(e); } finally { loading.value = false; } }; + // 已启用且和当前服务有关联规则的密钥 + const filterCurService = (data: Array) => { + return data.filter((item) => { + const splitStr = item.credential_scopes.map((str: string) => str.split('/')[0]); + return splitStr.includes(serviceName!.value) && item.spec.enable; + }); + }; // 下拉列表操作 const handleSelectChange = (val: newICredentialItem['spec']) => { const { name, enc_credential, privacyCredential } = val; @@ -180,7 +198,7 @@ color: #313238; } .no-app { - font-size: 16px; + font-size: 12px; color: #c4c6cc; } .arrow-icon { diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/example/index.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/example/index.vue index 4bbe104c36..58f2081b51 100644 --- a/bcs-services/bcs-bscp/ui/src/views/space/client/example/index.vue +++ b/bcs-services/bcs-bscp/ui/src/views/space/client/example/index.vue @@ -129,6 +129,9 @@ flex: 1; height: 100%; overflow: hidden; + :deep(.bk-alert-wraper) { + align-items: center; + } } .alert-tips { display: flex;