diff --git a/.eslintignore b/.eslintignore index 5e8f7404..54e8701e 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,4 +1,5 @@ /*.json /*.js /src/assets/js/ace/*.js +/src/assets/style/icon-font/*.js DIST \ No newline at end of file diff --git a/src/assets/style/custom.less b/src/assets/style/custom.less index ff059fee..46e89458 100644 --- a/src/assets/style/custom.less +++ b/src/assets/style/custom.less @@ -250,7 +250,7 @@ div#driver-highlighted-element-stage { // icon .arco-icon { font-size: 14px; - stroke-linecap: round; + // stroke-linecap: round; stroke-linejoin: bevel; stroke-width: 4; diff --git a/src/assets/style/icon-font/iconfont.css b/src/assets/style/icon-font/iconfont.css index 070f76bc..877b70ab 100644 --- a/src/assets/style/icon-font/iconfont.css +++ b/src/assets/style/icon-font/iconfont.css @@ -1,8 +1,8 @@ @font-face { font-family: 'iconfont'; /* Project id 3892962 */ - src: url('iconfont.woff2?t=1710141252463') format('woff2'), - url('iconfont.woff?t=1710141252463') format('woff'), - url('iconfont.ttf?t=1710141252463') format('truetype'); + src: url('iconfont.woff2?t=1710219573328') format('woff2'), + url('iconfont.woff?t=1710219573328') format('woff'), + url('iconfont.ttf?t=1710219573328') format('truetype'); } .iconfont { @@ -13,6 +13,10 @@ -moz-osx-font-smoothing: grayscale; } +.icon-copy-cloud::before { + content: '\e62f'; +} + .icon-Connector::before { content: '\e62e'; } diff --git a/src/assets/style/icon-font/iconfont.js b/src/assets/style/icon-font/iconfont.js new file mode 100644 index 00000000..ed7d95bd --- /dev/null +++ b/src/assets/style/icon-font/iconfont.js @@ -0,0 +1,69 @@ +(window._iconfont_svg_string_3892962 = + ''), + (function (a) { + var c = (c = document.getElementsByTagName('script'))[c.length - 1], + l = c.getAttribute('data-injectcss'), + c = c.getAttribute('data-disable-injectsvg'); + if (!c) { + var h, + i, + t, + o, + z, + m = function (c, l) { + l.parentNode.insertBefore(c, l); + }; + if (l && !a.__iconfont__svg__cssinject__) { + a.__iconfont__svg__cssinject__ = !0; + try { + document.write( + '' + ); + } catch (c) { + console && console.log(c); + } + } + (h = function () { + var c, + l = document.createElement('div'); + (l.innerHTML = a._iconfont_svg_string_3892962), + (l = l.getElementsByTagName('svg')[0]) && + (l.setAttribute('aria-hidden', 'true'), + (l.style.position = 'absolute'), + (l.style.width = 0), + (l.style.height = 0), + (l.style.overflow = 'hidden'), + (l = l), + (c = document.body).firstChild + ? m(l, c.firstChild) + : c.appendChild(l)); + }), + document.addEventListener + ? ~['complete', 'loaded', 'interactive'].indexOf(document.readyState) + ? setTimeout(h, 0) + : ((i = function () { + document.removeEventListener('DOMContentLoaded', i, !1), h(); + }), + document.addEventListener('DOMContentLoaded', i, !1)) + : document.attachEvent && + ((t = h), + (o = a.document), + (z = !1), + s(), + (o.onreadystatechange = function () { + 'complete' == o.readyState && + ((o.onreadystatechange = null), v()); + })); + } + function v() { + z || ((z = !0), t()); + } + function s() { + try { + o.documentElement.doScroll('left'); + } catch (c) { + return void setTimeout(s, 50); + } + v(); + } + })(window); diff --git a/src/assets/style/icon-font/iconfont.json b/src/assets/style/icon-font/iconfont.json index 3b8d4fc8..4cc4891c 100644 --- a/src/assets/style/icon-font/iconfont.json +++ b/src/assets/style/icon-font/iconfont.json @@ -5,6 +5,13 @@ "css_prefix_text": "icon-", "description": "", "glyphs": [ + { + "icon_id": "1089792", + "name": "cloudy", + "font_class": "copy-cloud", + "unicode": "e62f", + "unicode_decimal": 58927 + }, { "icon_id": "10987954", "name": "Connector", diff --git a/src/assets/style/icon-font/iconfont.ttf b/src/assets/style/icon-font/iconfont.ttf index 92cd0e4c..145cda61 100644 Binary files a/src/assets/style/icon-font/iconfont.ttf and b/src/assets/style/icon-font/iconfont.ttf differ diff --git a/src/assets/style/icon-font/iconfont.woff b/src/assets/style/icon-font/iconfont.woff index d77a6095..43ded737 100644 Binary files a/src/assets/style/icon-font/iconfont.woff and b/src/assets/style/icon-font/iconfont.woff differ diff --git a/src/assets/style/icon-font/iconfont.woff2 b/src/assets/style/icon-font/iconfont.woff2 index 6b39cb19..3e3d8e3a 100644 Binary files a/src/assets/style/icon-font/iconfont.woff2 and b/src/assets/style/icon-font/iconfont.woff2 differ diff --git a/src/components/progress-loading/index.vue b/src/components/progress-loading/index.vue index 7ef5ba8c..cd61dd3c 100644 --- a/src/components/progress-loading/index.vue +++ b/src/components/progress-loading/index.vue @@ -4,7 +4,9 @@ export default defineComponent({ props: { type: { - type: String as PropType<'success' | 'error' | 'warning' | 'inactive'>, + type: String as PropType< + 'success' | 'error' | 'warning' | 'inactive' | 'transitioning' + >, default() { return ''; } @@ -32,14 +34,12 @@ const renderProgress = () => { if (props.type === 'warning') { return ( - ); } @@ -76,6 +76,23 @@ return null; }; + const renderTransitioning = () => { + if (props.type === 'transitioning') { + return ( + + ); + } + return null; + }; + const renderInactive = () => { if (props.type === 'inactive') { return ( @@ -96,6 +113,7 @@ {renderError()} {renderSuccess()} {renderInactive()} + {renderTransitioning()} ); } diff --git a/src/views/application-management/environments/components/service-summary.vue b/src/views/application-management/environments/components/service-summary.vue index 2e3dbff6..6c41bf2c 100644 --- a/src/views/application-management/environments/components/service-summary.vue +++ b/src/views/application-management/environments/components/service-summary.vue @@ -48,17 +48,14 @@ flex-basis: 40px; align-items: center; justify-content: center; + margin-right: 10px; padding: 0; font-size: 12px; line-height: 1.6; border-radius: var(--border-radius-small); - &.error { - margin-right: 10px; - } - - &.transitioning { - margin: 0 10px; + &.inactive { + margin-right: 0; } } } diff --git a/src/views/application-management/environments/config/index.ts b/src/views/application-management/environments/config/index.ts index 0a279d0b..8f477c5d 100644 --- a/src/views/application-management/environments/config/index.ts +++ b/src/views/application-management/environments/config/index.ts @@ -101,7 +101,7 @@ export const EnvironmentActions: MoreAction[] = [ { label: 'common.button.clone', value: CommonButtonValue.Clone, - icon: 'icon-Clone-Cloud', + icon: 'icon-copy-cloud', iconfont: true, handler: '', status: 'normal', diff --git a/src/views/application-management/environments/pages/list.vue b/src/views/application-management/environments/pages/list.vue index 32d1054f..51f6a283 100644 --- a/src/views/application-management/environments/pages/list.vue +++ b/src/views/application-management/environments/pages/list.vue @@ -276,7 +276,8 @@ ready: 1, transitioning: 2, error: 3, - inactive: 4 + warning: 4, + inactive: 5 }; let timer: any = null; const { rowSelection, selectedKeys, handleSelectChange } = useRowSelect(); diff --git a/src/views/application-management/services/components/basic-info.vue b/src/views/application-management/services/components/basic-info.vue index 21f6e49e..0ddbc41e 100644 --- a/src/views/application-management/services/components/basic-info.vue +++ b/src/views/application-management/services/components/basic-info.vue @@ -50,14 +50,7 @@ <> ); diff --git a/src/views/application-management/services/components/instance/index.vue b/src/views/application-management/services/components/instance/index.vue index f863c93e..8d6dce11 100644 --- a/src/views/application-management/services/components/instance/index.vue +++ b/src/views/application-management/services/components/instance/index.vue @@ -9,15 +9,7 @@
{{ currentInfo.name }}
diff --git a/src/views/application-management/services/components/instance/service-resources.vue b/src/views/application-management/services/components/instance/service-resources.vue index aa5a175f..75b61f0d 100644 --- a/src/views/application-management/services/components/instance/service-resources.vue +++ b/src/views/application-management/services/components/instance/service-resources.vue @@ -75,14 +75,7 @@ - diff --git a/src/views/application-management/services/components/instance/service-revisions.vue b/src/views/application-management/services/components/instance/service-revisions.vue index 856ed40f..05398ea9 100644 --- a/src/views/application-management/services/components/instance/service-revisions.vue +++ b/src/views/application-management/services/components/instance/service-revisions.vue @@ -149,16 +149,7 @@ :title="$t('dashboard.table.status')" > diff --git a/src/views/application-management/services/components/resource-components/index.vue b/src/views/application-management/services/components/resource-components/index.vue index 6667e42e..4ea58197 100644 --- a/src/views/application-management/services/components/resource-components/index.vue +++ b/src/views/application-management/services/components/resource-components/index.vue @@ -13,14 +13,7 @@ - diff --git a/src/views/dashboard/hooks/use-status-config.ts b/src/views/dashboard/hooks/use-status-config.ts index 2fd99bd9..7751e755 100644 --- a/src/views/dashboard/hooks/use-status-config.ts +++ b/src/views/dashboard/hooks/use-status-config.ts @@ -8,14 +8,14 @@ export default function useStatusConfig() { running: 'running', failed: 'failed', succeeded: 'succeeded', - canceled: 'canceled' - // planned: 'planned' + canceled: 'canceled', + planned: 'planned' }; const statusColorMap = computed(() => { return { - running: 'rgba(247, 186, 30,1)', - // planned: 'rgba(66, 106, 208, 1)', + planned: 'rgba(247, 186, 30,1)', + running: 'rgba(66, 106, 208, 1)', failed: 'rgba(225,105,101,1)', succeeded: 'rgba(128, 212, 197, 1)', canceled: 'rgba(201,205,212,1)' @@ -25,15 +25,15 @@ export default function useStatusConfig() { const chartStatusColorMap = computed(() => { return appStore.isDark ? { - running: 'rgba(247, 186, 30,.5)', - // planned: 'rgba(102, 139, 220, .5)', + planned: 'rgba(247, 186, 30,.5)', + running: 'rgba(102, 139, 220, .5)', failed: 'rgba(203, 46, 52,.4)', succeeded: 'rgba(128, 212, 197, .5)', canceled: 'rgba(201,205,212,0.5)' } : { - running: 'rgba(247, 186, 30,.8)', - // planned: 'rgba(102, 139, 220, .8)', + planned: 'rgba(247, 186, 30,.8)', + running: 'rgba(102, 139, 220, .8)', failed: 'rgba(241, 106, 106,.6)', succeeded: 'rgba(128, 212, 197, .8)', canceled: 'rgba(201,205,212,0.8)' @@ -63,13 +63,13 @@ export default function useStatusConfig() { label: { show: false }, itemStyle: { color: chartStatusColorMap.value.running } }, - // { - // name: 'Planned', - // value: 0, - // key: 'planned', - // label: { show: false }, - // itemStyle: { color: chartStatusColorMap.value.planned } - // }, + { + name: 'Planned', + value: 0, + key: 'planned', + label: { show: false }, + itemStyle: { color: chartStatusColorMap.value.planned } + }, { name: 'Canceled', value: 0, diff --git a/src/views/operation-hub/catalogs/components/list-view.vue b/src/views/operation-hub/catalogs/components/list-view.vue index 3b803da0..cdd60559 100644 --- a/src/views/operation-hub/catalogs/components/list-view.vue +++ b/src/views/operation-hub/catalogs/components/list-view.vue @@ -61,13 +61,7 @@ diff --git a/src/views/operation-hub/catalogs/components/template-item.vue b/src/views/operation-hub/catalogs/components/template-item.vue index 4af2e1e3..d8881bb7 100644 --- a/src/views/operation-hub/catalogs/components/template-item.vue +++ b/src/views/operation-hub/catalogs/components/template-item.vue @@ -20,11 +20,12 @@ diff --git a/src/views/operation-hub/connectors/components/status-label.vue b/src/views/operation-hub/connectors/components/status-label.vue index 12cce576..a3d28960 100644 --- a/src/views/operation-hub/connectors/components/status-label.vue +++ b/src/views/operation-hub/connectors/components/status-label.vue @@ -1,20 +1,22 @@