From 86ca4e991987afbebb8026ef77d99c89fde2a500 Mon Sep 17 00:00:00 2001 From: xuzhan Date: Mon, 7 Nov 2022 15:53:39 +0800 Subject: [PATCH 001/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/.babelrc | 6 + .../devops-manage/.bk.development.env | 10 + src/frontend/devops-manage/.bk.env | 7 + src/frontend/devops-manage/.bk.production.env | 4 + src/frontend/devops-manage/.browserslistrc | 4 + src/frontend/devops-manage/.eslintrc.js | 16 ++ src/frontend/devops-manage/.gitignore | 78 ++++++ src/frontend/devops-manage/.stylelintignore | 1 + src/frontend/devops-manage/.stylelintrc.js | 4 + src/frontend/devops-manage/README.md | 1 + src/frontend/devops-manage/bk.config.js | 10 + src/frontend/devops-manage/index.html | 15 ++ src/frontend/devops-manage/package.json | 52 ++++ src/frontend/devops-manage/postcss.config.js | 32 +++ src/frontend/devops-manage/src/app.vue | 3 + src/frontend/devops-manage/src/common/util.ts | 60 +++++ .../src/components/manage-header.vue | 53 ++++ .../src/composables/use-filter.ts | 9 + src/frontend/devops-manage/src/css/index.css | 2 + src/frontend/devops-manage/src/css/main.css | 13 + src/frontend/devops-manage/src/css/reset.css | 236 ++++++++++++++++++ src/frontend/devops-manage/src/http/api.ts | 5 + .../src/http/fetch/error-interceptor.ts | 21 ++ .../devops-manage/src/http/fetch/index.ts | 103 ++++++++ .../src/http/fetch/request-error.ts | 11 + .../src/http/fetch/success-interceptor.ts | 26 ++ src/frontend/devops-manage/src/main.ts | 16 ++ .../devops-manage/src/router/index.ts | 47 ++++ src/frontend/devops-manage/src/store/user.ts | 16 ++ src/frontend/devops-manage/src/types/store.ts | 4 + .../devops-manage/src/views/apply-project.vue | 14 ++ .../src/views/manage/group/user-group.vue | 11 + .../src/views/manage/manage-entry.vue | 58 +++++ .../src/views/manage/project/edit-project.vue | 11 + .../src/views/manage/project/show-project.vue | 11 + .../devops-manage/static/images/favicon.png | Bin 0 -> 1472 bytes .../devops-manage/static/login_success.html | 14 ++ src/frontend/devops-manage/tsconfig.json | 45 ++++ src/frontend/devops-manage/types/global.d.ts | 3 + .../devops-manage/types/shims-vue.d.ts | 7 + src/frontend/package.json | 5 +- 41 files changed, 1043 insertions(+), 1 deletion(-) create mode 100644 src/frontend/devops-manage/.babelrc create mode 100644 src/frontend/devops-manage/.bk.development.env create mode 100644 src/frontend/devops-manage/.bk.env create mode 100644 src/frontend/devops-manage/.bk.production.env create mode 100644 src/frontend/devops-manage/.browserslistrc create mode 100644 src/frontend/devops-manage/.eslintrc.js create mode 100644 src/frontend/devops-manage/.gitignore create mode 100644 src/frontend/devops-manage/.stylelintignore create mode 100644 src/frontend/devops-manage/.stylelintrc.js create mode 100644 src/frontend/devops-manage/README.md create mode 100644 src/frontend/devops-manage/bk.config.js create mode 100644 src/frontend/devops-manage/index.html create mode 100644 src/frontend/devops-manage/package.json create mode 100644 src/frontend/devops-manage/postcss.config.js create mode 100644 src/frontend/devops-manage/src/app.vue create mode 100644 src/frontend/devops-manage/src/common/util.ts create mode 100644 src/frontend/devops-manage/src/components/manage-header.vue create mode 100644 src/frontend/devops-manage/src/composables/use-filter.ts create mode 100644 src/frontend/devops-manage/src/css/index.css create mode 100644 src/frontend/devops-manage/src/css/main.css create mode 100644 src/frontend/devops-manage/src/css/reset.css create mode 100644 src/frontend/devops-manage/src/http/api.ts create mode 100644 src/frontend/devops-manage/src/http/fetch/error-interceptor.ts create mode 100644 src/frontend/devops-manage/src/http/fetch/index.ts create mode 100644 src/frontend/devops-manage/src/http/fetch/request-error.ts create mode 100644 src/frontend/devops-manage/src/http/fetch/success-interceptor.ts create mode 100644 src/frontend/devops-manage/src/main.ts create mode 100644 src/frontend/devops-manage/src/router/index.ts create mode 100644 src/frontend/devops-manage/src/store/user.ts create mode 100644 src/frontend/devops-manage/src/types/store.ts create mode 100644 src/frontend/devops-manage/src/views/apply-project.vue create mode 100644 src/frontend/devops-manage/src/views/manage/group/user-group.vue create mode 100644 src/frontend/devops-manage/src/views/manage/manage-entry.vue create mode 100644 src/frontend/devops-manage/src/views/manage/project/edit-project.vue create mode 100644 src/frontend/devops-manage/src/views/manage/project/show-project.vue create mode 100644 src/frontend/devops-manage/static/images/favicon.png create mode 100644 src/frontend/devops-manage/static/login_success.html create mode 100644 src/frontend/devops-manage/tsconfig.json create mode 100644 src/frontend/devops-manage/types/global.d.ts create mode 100644 src/frontend/devops-manage/types/shims-vue.d.ts diff --git a/src/frontend/devops-manage/.babelrc b/src/frontend/devops-manage/.babelrc new file mode 100644 index 00000000000..d4457ee3b86 --- /dev/null +++ b/src/frontend/devops-manage/.babelrc @@ -0,0 +1,6 @@ +{ + "presets": [ + "@blueking/babel-preset-bk" + ] +} + \ No newline at end of file diff --git a/src/frontend/devops-manage/.bk.development.env b/src/frontend/devops-manage/.bk.development.env new file mode 100644 index 00000000000..badfd95a0f2 --- /dev/null +++ b/src/frontend/devops-manage/.bk.development.env @@ -0,0 +1,10 @@ +# .bk.development.env 生产模式生效 + +# 登录地址 +BK_LOGIN_URL = '' + +# 开发 host +BK_APP_HOST = 'localhost.com' + +# 开发 port +BK_APP_PORT = 80 diff --git a/src/frontend/devops-manage/.bk.env b/src/frontend/devops-manage/.bk.env new file mode 100644 index 00000000000..4b0d5162dbc --- /dev/null +++ b/src/frontend/devops-manage/.bk.env @@ -0,0 +1,7 @@ +# .env 所有环境生效的配置 + +# 接口前缀 +BK_AJAX_URL_PREFIX = '/' + +# 获取用户信息接口 +BK_USER_INFO_URL = '/user' diff --git a/src/frontend/devops-manage/.bk.production.env b/src/frontend/devops-manage/.bk.production.env new file mode 100644 index 00000000000..65dd668101d --- /dev/null +++ b/src/frontend/devops-manage/.bk.production.env @@ -0,0 +1,4 @@ +# .bk.production.env 生产模式生效 + +# 登录地址 +BK_LOGIN_URL = '{{ BK_LOGIN_URL }}' diff --git a/src/frontend/devops-manage/.browserslistrc b/src/frontend/devops-manage/.browserslistrc new file mode 100644 index 00000000000..14461370acc --- /dev/null +++ b/src/frontend/devops-manage/.browserslistrc @@ -0,0 +1,4 @@ +# Browsers that we support + +last 2 versions +> 1% diff --git a/src/frontend/devops-manage/.eslintrc.js b/src/frontend/devops-manage/.eslintrc.js new file mode 100644 index 00000000000..33dfc1e3207 --- /dev/null +++ b/src/frontend/devops-manage/.eslintrc.js @@ -0,0 +1,16 @@ +module.exports = { + root: true, + extends: ['@blueking/eslint-config-bk/tsvue3'], + parserOptions: { + tsconfigRootDir: __dirname, + project: [ + './tsconfig.json', + ], + }, + ignorePatterns: [ + 'dist/', + 'postcss.config.js', + 'bk.config.js', + 'index.html', + ], +}; diff --git a/src/frontend/devops-manage/.gitignore b/src/frontend/devops-manage/.gitignore new file mode 100644 index 00000000000..77985849878 --- /dev/null +++ b/src/frontend/devops-manage/.gitignore @@ -0,0 +1,78 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.vscode + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (http://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ +jspm_packages/ + +# Typescript v1 declaration files +typings/ + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Yarn Integrity file +.yarn-integrity + +# dotenv environment variables file +.env +package-lock.json +webpack-stats.json + +webpack_cache/ + +test/unit/coverage + +*.bak* + +# Editor directories and files +.DS_Store +.idea +*.suo +*.ntvs* +*.njsproj +*.sln +dist/ + +.bk.local.env diff --git a/src/frontend/devops-manage/.stylelintignore b/src/frontend/devops-manage/.stylelintignore new file mode 100644 index 00000000000..c2658d7d1b3 --- /dev/null +++ b/src/frontend/devops-manage/.stylelintignore @@ -0,0 +1 @@ +node_modules/ diff --git a/src/frontend/devops-manage/.stylelintrc.js b/src/frontend/devops-manage/.stylelintrc.js new file mode 100644 index 00000000000..2bea3aba56a --- /dev/null +++ b/src/frontend/devops-manage/.stylelintrc.js @@ -0,0 +1,4 @@ +module.exports = { + defaultSeverity: 'error', + extends: ['@blueking/stylelint-config-bk'], +} diff --git a/src/frontend/devops-manage/README.md b/src/frontend/devops-manage/README.md new file mode 100644 index 00000000000..d1354144442 --- /dev/null +++ b/src/frontend/devops-manage/README.md @@ -0,0 +1 @@ +bkuicli-vue3 diff --git a/src/frontend/devops-manage/bk.config.js b/src/frontend/devops-manage/bk.config.js new file mode 100644 index 00000000000..84f667646a3 --- /dev/null +++ b/src/frontend/devops-manage/bk.config.js @@ -0,0 +1,10 @@ + +module.exports = { + host: process.env.BK_APP_HOST, + port: process.env.BK_APP_PORT, + publicPath: process.env.BK_STATIC_URL, + cache: true, + open: false, + replaceStatic: false, + typescript: true, +}; diff --git a/src/frontend/devops-manage/index.html b/src/frontend/devops-manage/index.html new file mode 100644 index 00000000000..c7d38317f89 --- /dev/null +++ b/src/frontend/devops-manage/index.html @@ -0,0 +1,15 @@ + + + + + + + index + + +
+ + + diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json new file mode 100644 index 00000000000..63eec243a69 --- /dev/null +++ b/src/frontend/devops-manage/package.json @@ -0,0 +1,52 @@ +{ + "name": "devops-manage", + "version": "1.0.0", + "description": "", + "scripts": { + "dev": "bk-cli-service-webpack dev", + "build": "bk-cli-service-webpack build", + "server": "node ./paas-server/index.js", + "lint:style": "stylelint **/*.{html,vue,css,sass,scss,less} --fix" + }, + "keywords": [ + "bk-ci", + "metrics", + "vue3", + "webpack-5" + ], + "author": "", + "license": "ISC", + "dependencies": { + "art-template": "^4.13.2", + "bkui-vue": "0.0.1-beta.213", + "connect-history-api-fallback": "^2.0.0", + "cookie-parser": "^1.4.5", + "dayjs": "^1.11.2", + "express": "^4.18.2", + "express-art-template": "^1.0.1", + "pinia": "^2.0.23", + "request": "^2.88.2", + "vue": "^3.2.41", + "vue-router": "^4.1.6" + }, + "devDependencies": { + "@blueking/babel-preset-bk": "^2.1.0-beta7", + "@blueking/cli-service-webpack": "0.0.0-beta.56", + "@blueking/eslint-config-bk": "2.1.0-beta.12", + "@blueking/stylelint-config-bk": "^2.1.0-beta.9", + "enhanced-resolve": "^5.10.0", + "postcss": "~8.4.16", + "postcss-import": "^15.0.0", + "postcss-mixins": "^9.0.4", + "postcss-nested": "^6.0.0", + "postcss-nested-ancestors": "^3.0.0", + "postcss-preset-env": "^7.8.2", + "postcss-simple-vars": "^7.0.0", + "postcss-url": "^10.1.3", + "typescript": "^4.8.4" + }, + "engines": { + "node": ">= 14.16.1", + "npm": ">= 6.4.1 <7" + } +} diff --git a/src/frontend/devops-manage/postcss.config.js b/src/frontend/devops-manage/postcss.config.js new file mode 100644 index 00000000000..9f2b1ce9273 --- /dev/null +++ b/src/frontend/devops-manage/postcss.config.js @@ -0,0 +1,32 @@ +const fs = require('fs'); +const path = require('path'); +const { CachedInputFileSystem, ResolverFactory } = require('enhanced-resolve'); + +const myResolver = ResolverFactory.createResolver({ + alias: { + '@': path.resolve(__dirname, './lib/client/src'), + }, + preferRelative: true, + fileSystem: new CachedInputFileSystem(fs, 4000), + useSyncFileSystemCalls: true, + extensions: ['.css'], +}); + +module.exports = { + plugins: [ + [ + 'postcss-import', + { + resolve(id, baseDir) { + return myResolver.resolveSync({}, baseDir, id); + }, + }, + ], + 'postcss-simple-vars', + 'postcss-mixins', + 'postcss-nested-ancestors', + 'postcss-nested', + 'postcss-preset-env', + 'postcss-url', + ], +}; diff --git a/src/frontend/devops-manage/src/app.vue b/src/frontend/devops-manage/src/app.vue new file mode 100644 index 00000000000..a44ab87b704 --- /dev/null +++ b/src/frontend/devops-manage/src/app.vue @@ -0,0 +1,3 @@ + diff --git a/src/frontend/devops-manage/src/common/util.ts b/src/frontend/devops-manage/src/common/util.ts new file mode 100644 index 00000000000..543c72b4e61 --- /dev/null +++ b/src/frontend/devops-manage/src/common/util.ts @@ -0,0 +1,60 @@ +import dayjs from 'dayjs'; + +// 获取 cookie object +export function getCookies(strCookie = document.cookie): any { + if (!strCookie) { + return {}; + } + const arrCookie = strCookie.split('; ');// 分割 + const cookiesObj = {}; + arrCookie.forEach((cookieStr) => { + const arr = cookieStr.split('='); + const [key, value] = arr; + if (key) { + cookiesObj[key] = value; + } + }); + return cookiesObj; +} + +/** + * 检查是不是 object 类型 + * @param item + * @returns {boolean} + */ +export function isObject(item: any) { + return Object.prototype.toString.apply(item) === '[object Object]'; +} + + +/** + * 深度合并多个对象 + * @param objectArray 待合并列表 + * @returns {object} 合并后的对象 + */ +export function deepMerge(...objectArray: object[]) { + return objectArray.reduce((acc, obj) => { + Object.keys(obj || {}).forEach((key) => { + const pVal = acc[key]; + const oVal = obj[key]; + + if (isObject(pVal) && isObject(oVal)) { + acc[key] = deepMerge(pVal, oVal); + } else { + acc[key] = oVal; + } + }); + + return acc; + }, {}); +} + +/** + * 时间格式化 + * @param val 待格式化时间 + * @param format 格式 + * @returns 格式化后的时间 + */ +export function timeFormatter(val: string, format = 'YYYY-MM-DD HH:mm:ss') { + return val ? dayjs(val).format(format) : '--'; +} diff --git a/src/frontend/devops-manage/src/components/manage-header.vue b/src/frontend/devops-manage/src/components/manage-header.vue new file mode 100644 index 00000000000..4c92c6c9966 --- /dev/null +++ b/src/frontend/devops-manage/src/components/manage-header.vue @@ -0,0 +1,53 @@ + + + + + diff --git a/src/frontend/devops-manage/src/composables/use-filter.ts b/src/frontend/devops-manage/src/composables/use-filter.ts new file mode 100644 index 00000000000..608f3669c48 --- /dev/null +++ b/src/frontend/devops-manage/src/composables/use-filter.ts @@ -0,0 +1,9 @@ +export default () => { + const handleChange = (newStatus: string) => { + console.log('I am updated', newStatus); + }; + + return { + handleChange, + }; +}; diff --git a/src/frontend/devops-manage/src/css/index.css b/src/frontend/devops-manage/src/css/index.css new file mode 100644 index 00000000000..577385c9eea --- /dev/null +++ b/src/frontend/devops-manage/src/css/index.css @@ -0,0 +1,2 @@ +@import url(./main.css); +@import url(./reset.css); diff --git a/src/frontend/devops-manage/src/css/main.css b/src/frontend/devops-manage/src/css/main.css new file mode 100644 index 00000000000..c3847d6adce --- /dev/null +++ b/src/frontend/devops-manage/src/css/main.css @@ -0,0 +1,13 @@ +.app { + font-family: Avenir, Helvetica, Arial, sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-align: center; + background: #f5f7fb; + color: #63656e; + font-size: 12px; + text-align: left; + width: 100vw; + height: 100vh; + overflow: auto; +} diff --git a/src/frontend/devops-manage/src/css/reset.css b/src/frontend/devops-manage/src/css/reset.css new file mode 100644 index 00000000000..e7a0cf7efd7 --- /dev/null +++ b/src/frontend/devops-manage/src/css/reset.css @@ -0,0 +1,236 @@ +/*CSS Reset*/ +html, +body, +div, +dl, +dt, +dd, +ul, +ol, +li, +h1, +h2, +h3, +h4, +h5, +h6, +pre, +code, +form, +fieldset, +legend, +input, +textarea, +p, +blockquote, +tr, + +th, +td, +hgroup, +nav, +section, +article, +aside, +footer, +figure, +figcaption, +menu, +button, +applet, +object, + +iframe, +a, +abbr, + +acronym, + +address, +big, + +cite, + +code, +del, + +dfn, + +em, + +img, + +ins, + +kbd, + +q, +s, + +samp, +small, + +strike, + +strong, + +sub, + +sup, + +tt, + +var, +b, +u, + +i, + +center, +label, +table, + +caption, + +tbody, + +tfoot, + +thead, + +canvas, + +details, +embed, +main, + +output, + +ruby, + +summary, +time, + +mark, + +audio, + +video { + margin: 0; + padding: 0; +} + +/* HTML5 display-role reset for older browsers */ +article, + +aside, + +details, + +figcaption, + +figure, + +footer, + +hgroup, + +menu, + +nav, + +section { + display: block; +} + +body { + font-family: 'Helvetica Neue', Helvetica, STHeiTi, sans-serif; + line-height: 1.5; + font-size: 12px; + color: #000; + user-select: none; + user-select: none; + text-size-adjust: 100%; + -webkit-tap-highlight-color: transparent; + outline: 0; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: 100%; + font-weight: normal; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +caption, +th { + text-align: left; +} + +fieldset, +img { + border: 0; +} + +li { + list-style: none; +} + +ins { + text-decoration: none; +} + +del { + text-decoration: line-through; +} + +input, +button, +textarea, +select, +optgroup, +option { + font-family: inherit; + font-size: inherit; + font-style: inherit; + font-weight: inherit; + outline: 0; +} + +/* different browsers have different calculation methods for the box model width of input, select, and textarea */ +input, +select, +textarea { + box-sizing: content-box; + box-sizing: content-box; + box-sizing: content-box; +} + +button { + appearance: none; + border: 0; + background: none; +} + +a { + -webkit-touch-callout: none; + text-decoration: none; +} + +:focus { + outline: 0; + -webkit-tap-highlight-color: transparent; +} + +em, +i { + font-style: normal; +} diff --git a/src/frontend/devops-manage/src/http/api.ts b/src/frontend/devops-manage/src/http/api.ts new file mode 100644 index 00000000000..abfa2929bec --- /dev/null +++ b/src/frontend/devops-manage/src/http/api.ts @@ -0,0 +1,5 @@ +import fetch from './fetch'; + +const apiPerfix = '/api'; + +export const getUser = () => fetch.get(`${apiPerfix}/user`); diff --git a/src/frontend/devops-manage/src/http/fetch/error-interceptor.ts b/src/frontend/devops-manage/src/http/fetch/error-interceptor.ts new file mode 100644 index 00000000000..48783719b01 --- /dev/null +++ b/src/frontend/devops-manage/src/http/fetch/error-interceptor.ts @@ -0,0 +1,21 @@ +import type { IFetchConfig } from './index'; +import { Message } from 'bkui-vue'; + +// 请求执行失败拦截器 +export default (error: any, config: IFetchConfig) => { + const { + code, + message, + response, + } = error; + switch (code) { + // 用户登录状态失效 + case 401: + console.log(response); + } + // 全局捕获错误给出提示 + if (config.globalError) { + Message({ theme: 'error', message }); + } + return Promise.reject(error); +}; diff --git a/src/frontend/devops-manage/src/http/fetch/index.ts b/src/frontend/devops-manage/src/http/fetch/index.ts new file mode 100644 index 00000000000..d5b46eadc3e --- /dev/null +++ b/src/frontend/devops-manage/src/http/fetch/index.ts @@ -0,0 +1,103 @@ +import { deepMerge } from '@/common/util'; +import successInterceptor from './success-interceptor'; +import errorInterceptor from './error-interceptor'; +import RequestError from './request-error'; + +export interface IFetchConfig extends RequestInit { + responseType?: 'json' | 'text' | 'arrayBuffer' | 'blob' | 'formData', + globalError?: Boolean +} + +type HttpMethod = (url: string, payload?: any, config?: IFetchConfig) => Promise; + +interface IHttp { + get?: HttpMethod; + post?: HttpMethod; + put?: HttpMethod; + delete?: HttpMethod; + head?: HttpMethod; + options?: HttpMethod; + patch?: HttpMethod; +} + +// Content-Type +const contentTypeMap = { + json: 'application/json', + text: 'text/plain', + formData: 'multipart/form-data', +}; +const methodsWithoutData = ['delete', 'get', 'head', 'options']; +const methodsWithData = ['post', 'put', 'patch']; +const allMethods = [...methodsWithoutData, ...methodsWithData]; + +// 拼装发送请求配置 +const getFetchConfig = (method: string, payload: any, config: IFetchConfig) => { + // 合并配置 + let fetchConfig: IFetchConfig = deepMerge( + { + method: method.toLocaleUpperCase(), + mode: 'cors', + cache: 'default', + credentials: 'include', + headers: { + 'X-Requested-With': 'fetch', + 'Content-Type': contentTypeMap[config.responseType] || 'application/json', + }, + redirect: 'follow', + referrerPolicy: 'no-referrer-when-downgrade', + responseType: 'json', + globalError: true, + }, + config, + ); + // merge payload + if (methodsWithData.includes(method)) { + fetchConfig = deepMerge(fetchConfig, { body: JSON.stringify(payload) }); + } else { + fetchConfig = deepMerge(fetchConfig, payload); + } + return fetchConfig; +}; + +// 拼装发送请求 url +const getFetchUrl = (url: string, method: string, payload = {}) => { + try { + // 基础 url + const baseUrl = location.origin + process.env.BK_AJAX_URL_PREFIX; + // 构造 url 对象 + const urlObject: URL = new URL(url, baseUrl); + // get 请求需要将参数拼接到url上 + if (methodsWithoutData.includes(method)) { + Object.keys(payload).forEach((key) => { + const value = payload[key]; + if (!['', undefined, null].includes(value)) { + urlObject.searchParams.append(key, value); + } + }); + } + return urlObject.href; + } catch (error: any) { + throw new RequestError(-1, error.message); + } +}; + +// 在自定义对象 http 上添加各请求方法 +const http: IHttp = {}; +allMethods.forEach((method) => { + Object.defineProperty(http, method, { + get() { + return async (url: string, payload: any, config: IFetchConfig = {}) => { + const fetchConfig: IFetchConfig = getFetchConfig(method, payload, config); + try { + const fetchUrl = getFetchUrl(url, method, payload); + const response = await fetch(fetchUrl, fetchConfig); + return await successInterceptor(response, fetchConfig); + } catch (err) { + return errorInterceptor(err, fetchConfig); + } + }; + }, + }); +}); + +export default http; diff --git a/src/frontend/devops-manage/src/http/fetch/request-error.ts b/src/frontend/devops-manage/src/http/fetch/request-error.ts new file mode 100644 index 00000000000..763759da82f --- /dev/null +++ b/src/frontend/devops-manage/src/http/fetch/request-error.ts @@ -0,0 +1,11 @@ +export default class RequestError extends Error { + public code: number; + public message: string; + public response: any; + constructor(code: number, message: string, response?: any) { + super(); + this.code = code; + this.message = message; + this.response = response; + } +} diff --git a/src/frontend/devops-manage/src/http/fetch/success-interceptor.ts b/src/frontend/devops-manage/src/http/fetch/success-interceptor.ts new file mode 100644 index 00000000000..261892f8982 --- /dev/null +++ b/src/frontend/devops-manage/src/http/fetch/success-interceptor.ts @@ -0,0 +1,26 @@ +import type { IFetchConfig } from './index'; +import RequestError from './request-error'; + +// 请求成功执行拦截器 +export default async (response: Response, config: IFetchConfig) => { + const { + status = response.status, + data, + message = response.statusText, + } = await response[config.responseType](); + if (response.ok) { + // 对应 HTTP 请求的状态码 200 到 299 + // 校验接口返回的数据，status 为 0 表示业务成功 + switch (status) { + // 接口请求成功 + case 0: + return Promise.resolve(data); + // 后端业务处理报错 + default: + throw new RequestError(status, message || '系统错误', data); + } + } else { + // 处理 http 非 200 异常 + throw new RequestError(status || -1, message || '系统错误', data); + } +}; diff --git a/src/frontend/devops-manage/src/main.ts b/src/frontend/devops-manage/src/main.ts new file mode 100644 index 00000000000..b9a3dc382a7 --- /dev/null +++ b/src/frontend/devops-manage/src/main.ts @@ -0,0 +1,16 @@ +import { createApp } from 'vue'; +import { createPinia } from 'pinia'; +import router from './router'; +import App from './app.vue'; +import './css/index.css'; + +// 全量引入 bkui-vue +import bkui from 'bkui-vue'; +// 全量引入 bkui-vue 样式 +import 'bkui-vue/dist/style.css'; + +createApp(App) + .use(router) + .use(createPinia()) + .use(bkui) + .mount('.app'); diff --git a/src/frontend/devops-manage/src/router/index.ts b/src/frontend/devops-manage/src/router/index.ts new file mode 100644 index 00000000000..1a477c9fc97 --- /dev/null +++ b/src/frontend/devops-manage/src/router/index.ts @@ -0,0 +1,47 @@ +import { + createRouter, + createWebHistory, +} from 'vue-router'; + +const HomeEntry = () => import(/* webpackChunkName: "Manage" */ '../app.vue'); +const ApplyProject = () => import(/* webpackChunkName: "Apply" */ '../views/apply-project.vue'); +// 项目管理 +const ManageEntry = () => import(/* webpackChunkName: "Manage" */ '../views/manage/manage-entry.vue'); +const EditProject = () => import(/* webpackChunkName: "Manage" */ '../views/manage/project/edit-project.vue'); +const ShowProject = () => import(/* webpackChunkName: "Manage" */ '../views/manage/project/show-project.vue'); +// 用户组管理 +const UserGroup = () => import(/* webpackChunkName: "Manage" */ '../views/manage/group/user-group.vue'); + +export default createRouter({ + history: createWebHistory(), + routes: [ + { + path: '/', + component: HomeEntry, + children: [ + { + path: 'apply', + component: ApplyProject, + }, + { + path: 'manage', + component: ManageEntry, + children: [ + { + path: 'show', + component: ShowProject, + }, + { + path: 'edit', + component: EditProject, + }, + { + path: 'group', + component: UserGroup, + }, + ], + }, + ], + }, + ], +}); diff --git a/src/frontend/devops-manage/src/store/user.ts b/src/frontend/devops-manage/src/store/user.ts new file mode 100644 index 00000000000..bbfea645890 --- /dev/null +++ b/src/frontend/devops-manage/src/store/user.ts @@ -0,0 +1,16 @@ +import { defineStore } from 'pinia'; +import type { IUser } from 'types/store'; + +export const useUser = defineStore('user', { + state: () => ({ + user: { + username: '', + avatar_url: '', + }, + }), + actions: { + setUser(user: IUser) { + this.user = user; + }, + }, +}); diff --git a/src/frontend/devops-manage/src/types/store.ts b/src/frontend/devops-manage/src/types/store.ts new file mode 100644 index 00000000000..ba071d312b5 --- /dev/null +++ b/src/frontend/devops-manage/src/types/store.ts @@ -0,0 +1,4 @@ +export interface IUser { + username: string; + avatar_url: string; +} diff --git a/src/frontend/devops-manage/src/views/apply-project.vue b/src/frontend/devops-manage/src/views/apply-project.vue new file mode 100644 index 00000000000..e63d1d457d1 --- /dev/null +++ b/src/frontend/devops-manage/src/views/apply-project.vue @@ -0,0 +1,14 @@ + + + + + diff --git a/src/frontend/devops-manage/src/views/manage/group/user-group.vue b/src/frontend/devops-manage/src/views/manage/group/user-group.vue new file mode 100644 index 00000000000..ba23d2d6181 --- /dev/null +++ b/src/frontend/devops-manage/src/views/manage/group/user-group.vue @@ -0,0 +1,11 @@ + + + + + diff --git a/src/frontend/devops-manage/src/views/manage/manage-entry.vue b/src/frontend/devops-manage/src/views/manage/manage-entry.vue new file mode 100644 index 00000000000..f29a2afeab3 --- /dev/null +++ b/src/frontend/devops-manage/src/views/manage/manage-entry.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/src/frontend/devops-manage/src/views/manage/project/edit-project.vue b/src/frontend/devops-manage/src/views/manage/project/edit-project.vue new file mode 100644 index 00000000000..ba23d2d6181 --- /dev/null +++ b/src/frontend/devops-manage/src/views/manage/project/edit-project.vue @@ -0,0 +1,11 @@ + + + + + diff --git a/src/frontend/devops-manage/src/views/manage/project/show-project.vue b/src/frontend/devops-manage/src/views/manage/project/show-project.vue new file mode 100644 index 00000000000..ba23d2d6181 --- /dev/null +++ b/src/frontend/devops-manage/src/views/manage/project/show-project.vue @@ -0,0 +1,11 @@ + + + + + diff --git a/src/frontend/devops-manage/static/images/favicon.png b/src/frontend/devops-manage/static/images/favicon.png new file mode 100644 index 0000000000000000000000000000000000000000..4d4767b5671e21c6b8fc16cc9206a18a37404d50 GIT binary patch literal 1472 zcmdT^Jq`gu82zwOh{#r=S|SQZpjSD9s8pg5AyH^t#8t#W9KscR^EPj?-|UP|!m{7n z_cxpIvmyvx(U=PN}KHb_z`^$iv%zO2k$*dF+rWI0xfjz!pq|2zSgz)K#UOz`MRx7~lUdpk~HX0$%v;I_ghqcOOJ^Trb2K`(cZE44Dl*=>C_( x6wo~!qQ~>*Hs&nm86%Hk@*8LS-%xj{Z+r^GmdF*?^;t>J(K(qWR~SZBxNnmTwW + + + + + 登陆成功 + + + + + diff --git a/src/frontend/devops-manage/tsconfig.json b/src/frontend/devops-manage/tsconfig.json new file mode 100644 index 00000000000..7fb4284a2c3 --- /dev/null +++ b/src/frontend/devops-manage/tsconfig.json @@ -0,0 +1,45 @@ +{ + "compilerOptions": { + "target": "esnext", + "module": "esnext", + "moduleResolution": "node", + "strict": true, + "isolatedModules": false, + "esModuleInterop": true, + "noImplicitThis": true, + "noImplicitAny": true, + "strictNullChecks": true, + "suppressImplicitAnyIndexErrors": true, + "allowSyntheticDefaultImports": true, + "resolveJsonModule": true, + "jsx": "preserve", + "outDir": "dist", + "types": [ + "node" + ], + "paths": { + "@/*": [ + "./src/*" + ], + "@blueking/*": [ + "./node_modules/@blueking/*" + ], + "types/*": [ + "./src/types/*" + ] + }, + "typeRoots": [ + "typings" + ], + "lib": [ + "esnext", + "dom", + "dom.iterable", + "scripthost" + ] + }, + "include": [ + "./**/*", + ".eslintrc.js" + ] +} diff --git a/src/frontend/devops-manage/types/global.d.ts b/src/frontend/devops-manage/types/global.d.ts new file mode 100644 index 00000000000..a53afc0c549 --- /dev/null +++ b/src/frontend/devops-manage/types/global.d.ts @@ -0,0 +1,3 @@ +declare interface Window { + SITE_URL: string +} diff --git a/src/frontend/devops-manage/types/shims-vue.d.ts b/src/frontend/devops-manage/types/shims-vue.d.ts new file mode 100644 index 00000000000..01ac330ea6e --- /dev/null +++ b/src/frontend/devops-manage/types/shims-vue.d.ts @@ -0,0 +1,7 @@ + +declare module '*.vue' { + import type { DefineComponent } from 'vue'; + // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types + const component: DefineComponent<{}, {}, any>; + export default component; +} diff --git a/src/frontend/package.json b/src/frontend/package.json index 2bde03a38d3..2b8531bb61d 100644 --- a/src/frontend/package.json +++ b/src/frontend/package.json @@ -50,11 +50,14 @@ "devops-turbo", "devops-stream", "devops-metrics", + "devops-manage", "bk-pipeline" ], "nohoist": [ "devops-metrics", - "devops-metrics/**" + "devops-metrics/**", + "devops-manage", + "devops-manage/**" ] }, "dependencies": { From 1af2d1d7c25da2eac9b504338855db1702a7b8a9 Mon Sep 17 00:00:00 2001 From: xuzhan Date: Mon, 7 Nov 2022 20:40:38 +0800 Subject: [PATCH 002/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/package.json | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json index 63eec243a69..57352181da7 100644 --- a/src/frontend/devops-manage/package.json +++ b/src/frontend/devops-manage/package.json @@ -6,7 +6,11 @@ "dev": "bk-cli-service-webpack dev", "build": "bk-cli-service-webpack build", "server": "node ./paas-server/index.js", - "lint:style": "stylelint **/*.{html,vue,css,sass,scss,less} --fix" + "lint:style": "stylelint **/*.{html,vue,css,sass,scss,less} --fix", + "public:dev": "cross-env NODE_ENV=master bk-cli-service-webpack build", + "public:test": "cross-env NODE_ENV=master bk-cli-service-webpack build", + "public:master": "cross-env NODE_ENV=master bk-cli-service-webpack build", + "public:external": "cross-env NODE_ENV=master bk-cli-service-webpack build" }, "keywords": [ "bk-ci", From cc23423d149d8dc5abb5c593bc2ab611473b078d Mon Sep 17 00:00:00 2001 From: xuzhan Date: Mon, 7 Nov 2022 21:14:45 +0800 Subject: [PATCH 003/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/.bk.development.env | 2 ++ src/frontend/devops-manage/.bk.production.env | 2 ++ src/frontend/devops-manage/bk.config.js | 1 + src/frontend/devops-manage/package.json | 8 ++++---- 4 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/frontend/devops-manage/.bk.development.env b/src/frontend/devops-manage/.bk.development.env index badfd95a0f2..c95826a1c7c 100644 --- a/src/frontend/devops-manage/.bk.development.env +++ b/src/frontend/devops-manage/.bk.development.env @@ -8,3 +8,5 @@ BK_APP_HOST = 'localhost.com' # 开发 port BK_APP_PORT = 80 + +BK_OUTPUT_DIR = dist diff --git a/src/frontend/devops-manage/.bk.production.env b/src/frontend/devops-manage/.bk.production.env index 65dd668101d..49f819ae35c 100644 --- a/src/frontend/devops-manage/.bk.production.env +++ b/src/frontend/devops-manage/.bk.production.env @@ -2,3 +2,5 @@ # 登录地址 BK_LOGIN_URL = '{{ BK_LOGIN_URL }}' + +BK_OUTPUT_DIR = ../frontend/manage \ No newline at end of file diff --git a/src/frontend/devops-manage/bk.config.js b/src/frontend/devops-manage/bk.config.js index 84f667646a3..0bece5413c4 100644 --- a/src/frontend/devops-manage/bk.config.js +++ b/src/frontend/devops-manage/bk.config.js @@ -3,6 +3,7 @@ module.exports = { host: process.env.BK_APP_HOST, port: process.env.BK_APP_PORT, publicPath: process.env.BK_STATIC_URL, + outputDir: process.env.BK_OUTPUT_DIR, cache: true, open: false, replaceStatic: false, diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json index 57352181da7..12174e5f521 100644 --- a/src/frontend/devops-manage/package.json +++ b/src/frontend/devops-manage/package.json @@ -7,10 +7,10 @@ "build": "bk-cli-service-webpack build", "server": "node ./paas-server/index.js", "lint:style": "stylelint **/*.{html,vue,css,sass,scss,less} --fix", - "public:dev": "cross-env NODE_ENV=master bk-cli-service-webpack build", - "public:test": "cross-env NODE_ENV=master bk-cli-service-webpack build", - "public:master": "cross-env NODE_ENV=master bk-cli-service-webpack build", - "public:external": "cross-env NODE_ENV=master bk-cli-service-webpack build" + "public:dev": "bk-cli-service-webpack build", + "public:test": "bk-cli-service-webpack build", + "public:master": "bk-cli-service-webpack build", + "public:external": "bk-cli-service-webpack build" }, "keywords": [ "bk-ci", From bc91369ea0d1acef916e29e59c03c910098b740d Mon Sep 17 00:00:00 2001 From: xuzhan Date: Mon, 7 Nov 2022 22:26:14 +0800 Subject: [PATCH 004/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/.bk.production.env | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/frontend/devops-manage/.bk.production.env b/src/frontend/devops-manage/.bk.production.env index 49f819ae35c..552ecb6e5d0 100644 --- a/src/frontend/devops-manage/.bk.production.env +++ b/src/frontend/devops-manage/.bk.production.env @@ -3,4 +3,6 @@ # 登录地址 BK_LOGIN_URL = '{{ BK_LOGIN_URL }}' -BK_OUTPUT_DIR = ../frontend/manage \ No newline at end of file +BK_OUTPUT_DIR = ../frontend/manage + +BK_STATIC_URL = /manage/ From ca46eea0dddd427952256829b980bd0b33b83bcd Mon Sep 17 00:00:00 2001 From: xuzhan Date: Tue, 8 Nov 2022 10:26:08 +0800 Subject: [PATCH 005/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/.babelrc | 1 - src/frontend/devops-manage/package.json | 8 +------- 2 files changed, 1 insertion(+), 8 deletions(-) diff --git a/src/frontend/devops-manage/.babelrc b/src/frontend/devops-manage/.babelrc index d4457ee3b86..a54eaa01a6a 100644 --- a/src/frontend/devops-manage/.babelrc +++ b/src/frontend/devops-manage/.babelrc @@ -3,4 +3,3 @@ "@blueking/babel-preset-bk" ] } - \ No newline at end of file diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json index 12174e5f521..27534b0f514 100644 --- a/src/frontend/devops-manage/package.json +++ b/src/frontend/devops-manage/package.json @@ -14,22 +14,16 @@ }, "keywords": [ "bk-ci", - "metrics", + "manage", "vue3", "webpack-5" ], "author": "", "license": "ISC", "dependencies": { - "art-template": "^4.13.2", "bkui-vue": "0.0.1-beta.213", - "connect-history-api-fallback": "^2.0.0", - "cookie-parser": "^1.4.5", "dayjs": "^1.11.2", - "express": "^4.18.2", - "express-art-template": "^1.0.1", "pinia": "^2.0.23", - "request": "^2.88.2", "vue": "^3.2.41", "vue-router": "^4.1.6" }, From dedda43b981289591ba20bbbfef47b12490c7e2e Mon Sep 17 00:00:00 2001 From: xuzhan Date: Tue, 8 Nov 2022 11:08:43 +0800 Subject: [PATCH 006/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json index 27534b0f514..9d57a611b2e 100644 --- a/src/frontend/devops-manage/package.json +++ b/src/frontend/devops-manage/package.json @@ -29,7 +29,7 @@ }, "devDependencies": { "@blueking/babel-preset-bk": "^2.1.0-beta7", - "@blueking/cli-service-webpack": "0.0.0-beta.56", + "@blueking/cli-service-webpack": "0.0.0-beta.57", "@blueking/eslint-config-bk": "2.1.0-beta.12", "@blueking/stylelint-config-bk": "^2.1.0-beta.9", "enhanced-resolve": "^5.10.0", From 73553690ef94be5c1d1159992a708024979dc989 Mon Sep 17 00:00:00 2001 From: xuzhan Date: Tue, 8 Nov 2022 11:14:10 +0800 Subject: [PATCH 007/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/devops-manage/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json index 9d57a611b2e..d8cf8cb319e 100644 --- a/src/frontend/devops-manage/package.json +++ b/src/frontend/devops-manage/package.json @@ -29,7 +29,7 @@ }, "devDependencies": { "@blueking/babel-preset-bk": "^2.1.0-beta7", - "@blueking/cli-service-webpack": "0.0.0-beta.57", + "@blueking/cli-service-webpack": "0.0.0-beta.58", "@blueking/eslint-config-bk": "2.1.0-beta.12", "@blueking/stylelint-config-bk": "^2.1.0-beta.9", "enhanced-resolve": "^5.10.0", From 4091192f9bf86f807270a0ae228dcad16d452396 Mon Sep 17 00:00:00 2001 From: vhwweng <1010382269@qq.com> Date: Thu, 10 Nov 2022 17:29:41 +0800 Subject: [PATCH 008/608] =?UTF-8?q?feat:=20=E3=80=90=E5=89=8D=E7=AB=AF?= =?UTF-8?q?=E3=80=91=E6=96=B0=E5=A2=9E=E9=A1=B9=E7=9B=AE=E7=AE=A1=E7=90=86?= =?UTF-8?q?=E6=9C=8D=E5=8A=A1=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../devops-manage/.bk.development.env | 4 +- src/frontend/devops-manage/package.json | 1 + .../src/components/manage-header.vue | 40 ++++--- .../src/components/project-form.vue | 81 ++++++++++++++ src/frontend/devops-manage/src/css/main.css | 2 + src/frontend/devops-manage/src/main.ts | 18 +++ .../devops-manage/src/router/index.ts | 5 + .../devops-manage/src/views/apply-project.vue | 64 ++++++++++- .../src/views/manage/manage-entry.vue | 8 +- .../src/views/manage/project/edit-project.vue | 61 ++++++++++- .../src/views/manage/project/show-project.vue | 103 +++++++++++++++++- .../devops-manage/src/views/project-list.vue | 46 ++++++++ src/frontend/locale/manage/en-US.json | 3 + src/frontend/locale/manage/zh-CN.json | 2 + 14 files changed, 408 insertions(+), 30 deletions(-) create mode 100644 src/frontend/devops-manage/src/components/project-form.vue create mode 100644 src/frontend/devops-manage/src/views/project-list.vue create mode 100644 src/frontend/locale/manage/en-US.json create mode 100644 src/frontend/locale/manage/zh-CN.json diff --git a/src/frontend/devops-manage/.bk.development.env b/src/frontend/devops-manage/.bk.development.env index c95826a1c7c..c99bbc713e5 100644 --- a/src/frontend/devops-manage/.bk.development.env +++ b/src/frontend/devops-manage/.bk.development.env @@ -4,9 +4,9 @@ BK_LOGIN_URL = '' # 开发 host -BK_APP_HOST = 'localhost.com' +BK_APP_HOST = 'localhost' # 开发 port -BK_APP_PORT = 80 +BK_APP_PORT = 5000 BK_OUTPUT_DIR = dist diff --git a/src/frontend/devops-manage/package.json b/src/frontend/devops-manage/package.json index d8cf8cb319e..c59acc50901 100644 --- a/src/frontend/devops-manage/package.json +++ b/src/frontend/devops-manage/package.json @@ -25,6 +25,7 @@ "dayjs": "^1.11.2", "pinia": "^2.0.23", "vue": "^3.2.41", + "vue-i18n": "^9.1.10", "vue-router": "^4.1.6" }, "devDependencies": { diff --git a/src/frontend/devops-manage/src/components/manage-header.vue b/src/frontend/devops-manage/src/components/manage-header.vue index 4c92c6c9966..6074553c58c 100644 --- a/src/frontend/devops-manage/src/components/manage-header.vue +++ b/src/frontend/devops-manage/src/components/manage-header.vue @@ -7,28 +7,34 @@ defineProps<{ diff --git a/src/frontend/devops-manage/src/css/main.css b/src/frontend/devops-manage/src/css/main.css index c3847d6adce..ec2ee02e91e 100644 --- a/src/frontend/devops-manage/src/css/main.css +++ b/src/frontend/devops-manage/src/css/main.css @@ -10,4 +10,6 @@ width: 100vw; height: 100vh; overflow: auto; + display: flex; + flex-direction: column; } diff --git a/src/frontend/devops-manage/src/main.ts b/src/frontend/devops-manage/src/main.ts index b9a3dc382a7..ec2485734da 100644 --- a/src/frontend/devops-manage/src/main.ts +++ b/src/frontend/devops-manage/src/main.ts @@ -9,8 +9,26 @@ import bkui from 'bkui-vue'; // 全量引入 bkui-vue 样式 import 'bkui-vue/dist/style.css'; +// i18n +import { getCookies } from './common/util'; +import { createI18n } from 'vue-i18n'; +import ZhCN from '../../locale/manage/zh-CN.json'; +import EnUS from '../../locale/manage/en-US.json'; + +const cookiesObj = getCookies('blueking_language') || ''; +const i18n = createI18n({ + legacy: false, + locale: ['en', 'en-us', 'en_us'].includes((cookiesObj.blueking_language || '').toLowerCase()) ? 'en-US' : 'zh-CN', + fallbackLocale: 'zh-CN', + messages: { + 'zh-CN': ZhCN, + 'en-US': EnUS, + }, +}); + createApp(App) .use(router) .use(createPinia()) .use(bkui) + .use(i18n) .mount('.app'); diff --git a/src/frontend/devops-manage/src/router/index.ts b/src/frontend/devops-manage/src/router/index.ts index 1a477c9fc97..5a9ed9d8881 100644 --- a/src/frontend/devops-manage/src/router/index.ts +++ b/src/frontend/devops-manage/src/router/index.ts @@ -5,6 +5,7 @@ import { const HomeEntry = () => import(/* webpackChunkName: "Manage" */ '../app.vue'); const ApplyProject = () => import(/* webpackChunkName: "Apply" */ '../views/apply-project.vue'); +const ProjectList = () => import(/* webpackChunkName: "Manage" */ '../views/project-list.vue'); // 项目管理 const ManageEntry = () => import(/* webpackChunkName: "Manage" */ '../views/manage/manage-entry.vue'); const EditProject = () => import(/* webpackChunkName: "Manage" */ '../views/manage/project/edit-project.vue'); @@ -23,6 +24,10 @@ export default createRouter({ path: 'apply', component: ApplyProject, }, + { + path: 'list', + component: ProjectList, + }, { path: 'manage', component: ManageEntry, diff --git a/src/frontend/devops-manage/src/views/apply-project.vue b/src/frontend/devops-manage/src/views/apply-project.vue index e63d1d457d1..ddb34e38404 100644 --- a/src/frontend/devops-manage/src/views/apply-project.vue +++ b/src/frontend/devops-manage/src/views/apply-project.vue @@ -1,14 +1,68 @@ diff --git a/src/frontend/devops-manage/src/views/manage/manage-entry.vue b/src/frontend/devops-manage/src/views/manage/manage-entry.vue index f29a2afeab3..d1b973d4b25 100644 --- a/src/frontend/devops-manage/src/views/manage/manage-entry.vue +++ b/src/frontend/devops-manage/src/views/manage/manage-entry.vue @@ -1,14 +1,16 @@ @@ -63,7 +66,6 @@ - diff --git a/src/frontend/common-lib/user-group/index.vue b/src/frontend/common-lib/user-group/index.vue index 8bf7bee64b8..4a5b55cde0b 100644 --- a/src/frontend/common-lib/user-group/index.vue +++ b/src/frontend/common-lib/user-group/index.vue @@ -3,14 +3,14 @@ - - - - + + + diff --git a/src/frontend/devops-manage/src/components/user-group/group-aside.vue b/src/frontend/devops-manage/src/components/user-group/group-aside.vue index 649d483f3c6..6647f42c6ca 100644 --- a/src/frontend/devops-manage/src/components/user-group/group-aside.vue +++ b/src/frontend/devops-manage/src/components/user-group/group-aside.vue @@ -6,14 +6,14 @@ v-for="(group, index) in groupList" :key="index" @click="handleChangeTab(group)"> - {{ group.name }} + {{ group.name }} - - {{ group.user }} + + {{ group.userCount }} - - {{ group.group }} + + {{ group.departmentCount }} + @click="handleShowDeleteGroup(group)"> {{ $t('删除') }} @@ -49,13 +49,16 @@ {{ $t('关闭权限管理') }} + {{ $t('是否删除用户组', [deleteObj.group.name]) }} @@ -87,17 +90,30 @@ export default { type: Function, default: () => {}, }, + deleteGroup: { + type: Function, + default: () => {}, + }, }, emits: ['create-group', 'choose-group', 'delete-group'], data() { return { - activeTab: '管理员', + activeTab: '', deleteObj: { group: {}, isShow: false, + isLoading: false, }, }; }, + watch: { + groupList: { + handler() { + this.activeTab = this.groupList[0]?.name; + }, + immediate: true, + }, + }, methods: { handleShowDeleteGroup(group) { this.deleteObj.group = group; @@ -108,8 +124,13 @@ export default { this.deleteObj.group = {}; }, handleDeleteGroup() { - this.$emit('delete-group', this.deleteObj.group); - this.handleHiddenDeleteGroup(); + this.deleteObj.isLoading = true; + return this + .deleteGroup(this.deleteObj.group) + .then(() => { + this.deleteObj.isLoading = false; + this.handleHiddenDeleteGroup(); + }); }, handleChangeTab(group) { this.activeTab = group.name; @@ -167,6 +188,10 @@ export default { .group-active { color: #3A84FF; background-color: #E1ECFF; + .user-num, .group-num { + background-color: #A3C5FD; + color: #fff; + } } .user-num, .group-num { @@ -175,7 +200,10 @@ export default { } .group-name { display: inline-block; - min-width: 110px; + width: 100px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; } .user-num, .group-num { @@ -190,7 +218,7 @@ export default { line-height: 16px; margin-right: 3px; text-align: center; - color: #979BA5; + color: #C4C6CC; } .more-icon { border-radius: 50%; @@ -232,4 +260,7 @@ export default { margin-bottom: 20px; text-align: center; } + .small-size { + scale: 0.9; + } diff --git a/src/frontend/devops-manage/src/components/user-group/group-entry.vue b/src/frontend/devops-manage/src/components/user-group/group-entry.vue index a71ec781ad2..c5e7b2f7339 100644 --- a/src/frontend/devops-manage/src/components/user-group/group-entry.vue +++ b/src/frontend/devops-manage/src/components/user-group/group-entry.vue @@ -3,14 +3,14 @@ @@ -162,7 +163,8 @@ export default { projectCode, }) .then((res) => { - this.groupList = res.data; + this.groupList = res; + this.iamIframePath = `user-group-detail/${res[0]?.id}`; }); }, @@ -183,9 +185,27 @@ export default { projectCode, }) .then((res) => { - this.memberGroupList = res.data; + this.memberGroupList = res; }); }, + + /** + * 删除用户组 + */ + handleDeleteGroup(group: any) { + const { + resourceType, + projectCode, + } = this; + + return http + .deleteGroup({ + resourceType, + projectCode, + groupId: group.id, + }) + .then(() => this.fetchMemberGroupList()); + }, }, }; From 4aa9d4f908326b48e92d5c7fa3d4cfd234cb9846 Mon Sep 17 00:00:00 2001 From: vhwweng <1010382269@qq.com> Date: Thu, 9 Feb 2023 15:36:25 +0800 Subject: [PATCH 047/608] =?UTF-8?q?feature:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9?= =?UTF-8?q?=E7=9B=AE=E7=AE=A1=E7=90=86=E5=89=8D=E7=AB=AF=E6=9C=8D=E5=8A=A1?= =?UTF-8?q?=20issue=20#7923?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/project-form.vue | 13 +- .../src/components/user-group/group-aside.vue | 70 +- .../src/components/user-group/group-entry.vue | 56 +- src/frontend/devops-manage/src/http/api.ts | 11 +- .../src/views/manage/group/group-entry.vue | 8 + .../src/views/manage/project/edit-project.vue | 41 +- .../src/views/manage/project/show-project.vue | 210 ++++- .../src/components/permission-aside.vue | 2 +- .../src/components/permission-header.vue | 1 + .../devops-permission/src/css/fonts.css | 18 + .../src/css/fonts/iconcool.eot | Bin 1968 -> 2816 bytes .../src/css/fonts/iconcool.svg | 18 + .../src/css/fonts/iconcool.ttf | Bin 1800 -> 2648 bytes .../src/css/fonts/iconcool.woff | Bin 1112 -> 1692 bytes .../devops-permission/src/http/api.ts | 40 +- .../devops-permission/src/http/fetch/index.ts | 1 + .../src/http/fetch/success-interceptor.ts | 4 +- src/frontend/devops-permission/src/main.ts | 2 +- .../devops-permission/src/utils/dom.js | 50 ++ .../devops-permission/src/utils/tools.js | 19 + .../applyPermission/apply-permission.vue | 125 ++- .../views/applyPermission/group-detail.vue | 104 ++- .../views/applyPermission/group-search.vue | 217 +++-- .../views/applyPermission/search-select.vue | 816 ++++++++++++++++++ .../src/views/applyPermission/selectTag.vue | 79 ++ 25 files changed, 1723 insertions(+), 182 deletions(-) create mode 100644 src/frontend/devops-permission/src/utils/dom.js create mode 100644 src/frontend/devops-permission/src/utils/tools.js create mode 100644 src/frontend/devops-permission/src/views/applyPermission/search-select.vue create mode 100644 src/frontend/devops-permission/src/views/applyPermission/selectTag.vue diff --git a/src/frontend/devops-manage/src/components/project-form.vue b/src/frontend/devops-manage/src/components/project-form.vue index 95829c1f267..84a13ad00fd 100644 --- a/src/frontend/devops-manage/src/components/project-form.vue +++ b/src/frontend/devops-manage/src/components/project-form.vue @@ -1,6 +1,7 @@ @@ -261,7 +279,7 @@ prettyDateTimeFormat } from '@/utils/' import ResetAuthDialog from './ResetAuthDialog.vue' - + export default { name: 'basicSetting', components: { @@ -415,7 +433,6 @@ * 校验仓库是否已经在其他项目开启了PAC */ handleCheckPacProject (repoUrl) { - console.log(this.repositoryType, 'this.repositoryType') if (this.isGit && repoUrl) { this.checkPacProject({ repoUrl, @@ -603,6 +620,10 @@ async openValidate () { window.location.href = this[`${this.codelibTypeConstants}OAuth`].url + }, + + updateList () { + this.$emit('updateList') } } } @@ -725,6 +746,7 @@ } .history-item { display: inline-flex; + line-height: 16px; min-width: 230px; max-width: 300px; margin-right: 200px; @@ -732,6 +754,7 @@ .label { width: 120px; font-size: 12px; + font-weight: 400; color: #979BA5; } .content { diff --git a/src/frontend/devops-codelib/src/components/CodeLibDetail/index.vue b/src/frontend/devops-codelib/src/components/CodeLibDetail/index.vue index 3f2d00b89f4..6f1cb163c3a 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDetail/index.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDetail/index.vue @@ -91,6 +91,7 @@ :type="repoInfo['@type']" :fetch-repo-detail="fetchRepoDetail" :refresh-codelib-list="refreshCodelibList" + @updateList="updateList" > @@ -138,6 +139,10 @@ }, refreshCodelibList: { type: Function + }, + switchPage: { + type: Function, + required: true } }, data () { @@ -244,7 +249,7 @@ message: this.$t('codelib.保存成功'), theme: 'success' }) - this.$emit('updateList') + this.updateList() }).catch(e => { this.$bkMessage({ message: e.message || e, @@ -257,6 +262,10 @@ }) }, + updateList () { + this.switchPage(1, this.$route.query.limit) + }, + /** * 取消编辑 关闭代码库别名编辑状态 */ @@ -383,7 +392,7 @@ } span { display: inline-block; - max-width: 500px; + max-width: 400px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/src/frontend/devops-codelib/src/components/CodeLibDetail/timeline-collapse.vue b/src/frontend/devops-codelib/src/components/CodeLibDetail/timeline-collapse.vue index c84629f6b26..ab18fae5e72 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDetail/timeline-collapse.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDetail/timeline-collapse.vue @@ -30,7 +30,7 @@ {{ $t('codelib.一键重新触发') }} @@ -39,10 +39,7 @@ 'right-shape': true, 'right-down': activeIndex === index }" - svg type="angle-right" - width="24" - height="24" /> @@ -77,7 +74,7 @@
- {{ $t('codelib.重新触发') }} + {{ $t('codelib.重新触发') }}
@@ -85,7 +82,8 @@ @@ -143,30 +141,45 @@ /** * 一键重新触发 */ - handleReplayAll (id) { - this.replayAllEvent({ - projectId: this.projectId, - eventId: id - }).then(() => { - this.$bkMessage({ - theme: 'success', - message: this.$t('codelib.触发成功') - }) + handleReplayAll (eventId) { + this.$bkInfo({ + title: this.$t('codelib.确认重放此事件吗？'), + confirmLoading: true, + confirmFn: async () => { + this.replayAllEvent({ + projectId: this.projectId, + eventId + }).then(() => { + this.$bkMessage({ + theme: 'success', + message: this.$t('codelib.触发成功') + }) + }) + } }) }, /** * 重新触发 */ - handleReplay (id) { - this.replayEvent({ - projectId: this.projectId, - detailId: id - }).then(() => { - this.$bkMessage({ - theme: 'success', - message: this.$t('codelib.触发成功') - }) + handleReplay (payload) { + const { detailId, pipelineName } = payload + this.$bkInfo({ + extCls: 'replay-dialog', + width: 400, + title: this.$t('codelib.确认以此事件重新触发流水线 X 吗？', [pipelineName]), + confirmLoading: true, + confirmFn: async () => { + this.replayEvent({ + projectId: this.projectId, + detailId + }).then(() => { + this.$bkMessage({ + theme: 'success', + message: this.$t('codelib.触发成功') + }) + }) + } }) }, @@ -248,7 +261,7 @@ margin-bottom: 8px; cursor: pointer; &.active { - background-color: #E1ECFF; + background-color: #F0F5FF; } .title { display: flex; @@ -276,6 +289,8 @@ } } .right-shape { + font-size: 24px !important; + color: #C4C6CC; transition: 200ms transform; &.right-down { transform: rotate(90deg); @@ -319,11 +334,19 @@ } } .trigger-table-pagination { - height: 63px; - padding: 14px 20px 0; + height: 43px; + padding: 5px 20px 0; } .is-show-table { animation: fade-in 1s ease-in-out; } } + + + diff --git a/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger-event.vue b/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger-event.vue index 315df11cc57..a1cda5f01be 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger-event.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger-event.vue @@ -9,6 +9,7 @@ :options="{ disabledDate: time => time.getTime() > Date.now() }" + :key="repoId" > @@ -39,7 +41,7 @@ -
+
{{ $t('codelib.加载更多') }} {{ $t('codelib.到底啦') }}
@@ -133,8 +135,10 @@ async repoId (id) { await this.getEventTypeList() await this.getTriggerTypeList() - await this.resetFilter() + await this.triggerRepo() + await this.setDefaultDaterange() this.catchRepoId = id + this.isInitTime = true }, daterange (newVal, oldVal) { if (oldVal[0]) this.isInitTime = false @@ -161,10 +165,7 @@ this.catchRepoId = this.repoId this.getEventTypeList() this.getTriggerTypeList() - const endTime = new Date() - const startTime = new Date() - startTime.setTime(startTime.getTime() - 3600 * 1000 * 24 * 7) - this.daterange = [startTime, endTime] + this.setDefaultDaterange() }, methods: { ...mapActions('codelib', [ @@ -172,6 +173,12 @@ 'fetchEventType', 'fetchTriggerType' ]), + setDefaultDaterange () { + const endTime = new Date() + const startTime = new Date() + startTime.setTime(startTime.getTime() - 3600 * 1000 * 24 * 7) + this.daterange = [startTime, endTime] + }, getEventTypeList () { this.fetchEventType({ scmType: this.triggerType @@ -185,7 +192,9 @@ }) }, getTriggerTypeList () { - this.fetchTriggerType().then(res => { + this.fetchTriggerType({ + scmType: this.triggerType + }).then(res => { this.triggerTypeList = res.map(i => { return { ...i, @@ -238,9 +247,8 @@ this.timelineMap[dateKey].push(item) }) - + this.showEnd = res.count <= this.pageSize this.hasLoadEnd = res.count === this.eventList.length - console.log(this.hasLoadEnd, 'hasLoadEnd') this.page += 1 }).finally(() => { this.pageLoading = false @@ -256,6 +264,15 @@ this.eventList = [] this.timelineMap = {} this.getListData() + }, + triggerRepo () { + this.catchRepoId = '' + this.searchValue = [] + this.page = 1 + this.hasLoadEnd = false + this.eventList = [] + this.timelineMap = {} + this.getListData() } } } @@ -276,6 +293,7 @@ .timeline-warpper { height: calc(100% - 32px); padding-top: 20px; + margin-top: 8px; overflow-y: scroll; &::-webkit-scrollbar { background-color: #fff; @@ -285,7 +303,7 @@ } } .trigger-timeline { - padding: 8px; + padding: 0 8px; .timeline-dot { border-left: 1px solid #d8d8d8; font-size: 0; diff --git a/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger.vue b/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger.vue index c0573dcefa8..3ba436fa975 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDetail/trigger.vue @@ -26,16 +26,29 @@ @@ -246,7 +259,6 @@ }).then(res => { this.pagination.count = res.count this.triggerData = res.records - console.log(this.triggerData, 12) }).finally(() => { this.isLoading = false }) @@ -270,7 +282,9 @@ * 获取触发器类型 */ getTriggerTypeList () { - this.fetchTriggerType().then(res => { + this.fetchTriggerType({ + scmType: this.scmType + }).then(res => { this.triggerTypeList = res.map(i => { return { ...i, @@ -292,6 +306,7 @@ handelShowDetail (row) { this.curAtom = row + console.log(row, 123) this.$refs.atomDetailRef.isShow = true } } diff --git a/src/frontend/devops-codelib/src/components/CodeLibDialog/Git.vue b/src/frontend/devops-codelib/src/components/CodeLibDialog/Git.vue index 4638018a9a4..513287c826e 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDialog/Git.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDialog/Git.vue @@ -30,7 +30,7 @@ - {{ $t('codelib.用户名密码+个人token') }} + {{ $t('codelib.用户名+密码') }} diff --git a/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue b/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue index e2a5d1b185a..d97726af27a 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue @@ -17,7 +17,7 @@ class="mr20" value="HTTPS" > - {{ $t('codelib.用户名密码+个人token') }} + {{ $t('codelib.用户名+密码') }} diff --git a/src/frontend/devops-codelib/src/components/CodeLibTable/index.vue b/src/frontend/devops-codelib/src/components/CodeLibTable/index.vue index 015eceb0427..49ab884085d 100755 --- a/src/frontend/devops-codelib/src/components/CodeLibTable/index.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibTable/index.vue @@ -1,11 +1,12 @@ diff --git a/src/frontend/devops-codelib/src/components/AtomContent/NormalAtom.vue b/src/frontend/devops-codelib/src/components/AtomContent/NormalAtom.vue index d5eda8039b4..0daafdc66a1 100644 --- a/src/frontend/devops-codelib/src/components/AtomContent/NormalAtom.vue +++ b/src/frontend/devops-codelib/src/components/AtomContent/NormalAtom.vue @@ -2,6 +2,7 @@
diff --git a/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue b/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue index d97726af27a..0e669dbb7f0 100644 --- a/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue +++ b/src/frontend/devops-codelib/src/components/CodeLibDialog/TGit.vue @@ -80,7 +80,7 @@ - {{ $t('codelib.new') }} + {{ $t('codelib.new') }}