From 1cb263efda55e67a8d5066edd7709b056f9b85ff Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期二, 07 九月 2021 18:46:59 +0800 Subject: [PATCH] code format --- src/views/401.vue | 438 +++++++------- src/api/package.js | 16 src/api/user.js | 28 src/api/project.js | 46 src/views/login/index.vue | 466 ++++++++-------- src/views/project/components/ProjectEdit.vue | 61 +- src/views/project/index.vue | 226 ++++--- src/views/index/index.vue | 4 src/App.vue | 8 src/views/404.vue | 436 +++++++------- 10 files changed, 895 insertions(+), 834 deletions(-) diff --git a/src/App.vue b/src/App.vue index 94f824e..e2ad31f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -5,8 +5,8 @@ </template> <script> - export default { - name: 'App', - mounted() {}, - } +export default { + name: "App", + mounted() {}, +}; </script> diff --git a/src/api/package.js b/src/api/package.js index c8334f6..4961f46 100644 --- a/src/api/package.js +++ b/src/api/package.js @@ -1,9 +1,17 @@ -import request from '@/utils/request' +import request from "@/utils/request"; export function publish(data) { return request({ - url: '/package/' + data.id + '/publish', - method: 'post', + url: "/package/" + data.id + "/publish", + method: "post", data, - }) + }); +} + +export function download(query) { + return request({ + url: "/package/download", + method: "get", + params: query, + }); } diff --git a/src/api/project.js b/src/api/project.js index c892e47..ee06075 100644 --- a/src/api/project.js +++ b/src/api/project.js @@ -1,51 +1,51 @@ -import request from '@/utils/request' +import request from "@/utils/request"; export function getList() { return request({ - url: '/projects', - method: 'get', - }) + url: "/projects", + method: "get", + }); } export function doEdit(data) { if (!data.id) { return request({ - url: '/projects', - method: 'post', + url: "/projects", + method: "post", data, - }) + }); } - delete data.updatedAt - delete data.createdAt + delete data.updatedAt; + delete data.createdAt; return request({ - url: '/projects', - method: 'put', + url: "/projects", + method: "put", data, - }) + }); } export function deletePrj(id) { return request({ - url: '/projects/' + id, - method: 'delete', - }) + url: "/projects/" + id, + method: "delete", + }); } export function getPkgList(id) { return request({ - url: '/projects/' + id + '/packages', - method: 'get', - }) + url: "/projects/" + id + "/packages", + method: "get", + }); } export function buildPkg(data, version) { - delete data.updatedAt - delete data.createdAt + delete data.updatedAt; + delete data.createdAt; return request({ - url: '/projects/build/' + version, - method: 'post', + url: "/projects/build/" + version, + method: "post", data, - }) + }); } diff --git a/src/api/user.js b/src/api/user.js index f661449..dce05f1 100644 --- a/src/api/user.js +++ b/src/api/user.js @@ -1,34 +1,34 @@ -import request from '@/utils/request' -import { loginRSA, tokenName } from '@/config' +import request from "@/utils/request"; +import { loginRSA, tokenName } from "@/config"; export async function login(data) { return request({ - url: '/user/login', - method: 'post', + url: "/user/login", + method: "post", data, - }) + }); } export function getUserInfo(accessToken) { return request({ - url: '/user/info', - method: 'post', + url: "/user/info", + method: "post", data: { [tokenName]: accessToken, }, - }) + }); } export function logout() { return request({ - url: '/logout', - method: 'post', - }) + url: "/logout", + method: "post", + }); } export function register() { return request({ - url: '/register', - method: 'post', - }) + url: "/register", + method: "post", + }); } diff --git a/src/views/401.vue b/src/views/401.vue index a47ecac..e2defb1 100644 --- a/src/views/401.vue +++ b/src/views/401.vue @@ -28,7 +28,7 @@ </el-col> <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12"> - <div class="bullshit"> + <div class="bullshit"> <div class="bullshit-oops">{{ oops }}</div> <div class="bullshit-headline">{{ headline }}</div> <div class="bullshit-info">{{ info }}</div> @@ -43,254 +43,254 @@ </template> <script> - export default { - name: 'Page401', - data() { - return { - jumpTime: 5, - oops: '鎶辨瓑!', - headline: '鎮ㄦ病鏈夋搷浣滄潈闄�...', - info: '褰撳墠甯愬彿娌℃湁鎿嶄綔鏉冮檺,璇疯仈绯荤鐞嗗憳銆�', - btn: '杩斿洖', - timer: 0, - } +export default { + name: "Page401", + data() { + return { + jumpTime: 5, + oops: "鎶辨瓑!", + headline: "鎮ㄦ病鏈夋搷浣滄潈闄�...", + info: "褰撳墠甯愬彿娌℃湁鎿嶄綔鏉冮檺,璇疯仈绯荤鐞嗗憳銆�", + btn: "杩斿洖", + timer: 0, + }; + }, + mounted() { + this.timeChange(); + }, + beforeDestroy() { + clearInterval(this.timer); + }, + methods: { + timeChange() { + this.timer = setInterval(() => { + if (this.jumpTime) { + this.jumpTime--; + } else { + this.$router.push({ path: "/" }); + this.$store.dispatch("tabsBar/delOthersRoutes", { + path: "/", + }); + clearInterval(this.timer); + } + }, 1000); }, - mounted() { - this.timeChange() - }, - beforeDestroy() { - clearInterval(this.timer) - }, - methods: { - timeChange() { - this.timer = setInterval(() => { - if (this.jumpTime) { - this.jumpTime-- - } else { - this.$router.push({ path: '/' }) - this.$store.dispatch('tabsBar/delOthersRoutes', { - path: '/', - }) - clearInterval(this.timer) - } - }, 1000) - }, - }, - } + }, +}; </script> <style lang="scss" scoped> - .error-container { - position: absolute; - top: 40%; - left: 50%; - transform: translate(-50%, -50%); +.error-container { + position: absolute; + top: 40%; + left: 50%; + transform: translate(-50%, -50%); - .error-content { - .pic-error { - position: relative; - float: left; - width: 120%; - overflow: hidden; + .error-content { + .pic-error { + position: relative; + float: left; + width: 120%; + overflow: hidden; - &-parent { - width: 100%; - } - - &-child { - position: absolute; - - &.left { - top: 17px; - left: 220px; - width: 80px; - opacity: 0; - animation-name: cloudLeft; - animation-duration: 2s; - animation-timing-function: linear; - animation-delay: 1s; - animation-fill-mode: forwards; - } - - &.mid { - top: 10px; - left: 420px; - width: 46px; - opacity: 0; - animation-name: cloudMid; - animation-duration: 2s; - animation-timing-function: linear; - animation-delay: 1.2s; - animation-fill-mode: forwards; - } - - &.right { - top: 100px; - left: 500px; - width: 62px; - opacity: 0; - animation-name: cloudRight; - animation-duration: 2s; - animation-timing-function: linear; - animation-delay: 1s; - animation-fill-mode: forwards; - } - - @keyframes cloudLeft { - 0% { - top: 17px; - left: 220px; - opacity: 0; - } - - 20% { - top: 33px; - left: 188px; - opacity: 1; - } - - 80% { - top: 81px; - left: 92px; - opacity: 1; - } - - 100% { - top: 97px; - left: 60px; - opacity: 0; - } - } - - @keyframes cloudMid { - 0% { - top: 10px; - left: 420px; - opacity: 0; - } - - 20% { - top: 40px; - left: 360px; - opacity: 1; - } - - 70% { - top: 130px; - left: 180px; - opacity: 1; - } - - 100% { - top: 160px; - left: 120px; - opacity: 0; - } - } - - @keyframes cloudRight { - 0% { - top: 100px; - left: 500px; - opacity: 0; - } - - 20% { - top: 120px; - left: 460px; - opacity: 1; - } - - 80% { - top: 180px; - left: 340px; - opacity: 1; - } - - 100% { - top: 200px; - left: 300px; - opacity: 0; - } - } - } + &-parent { + width: 100%; } - .bullshit { - position: relative; - float: left; - width: 300px; - padding: 30px 0; - overflow: hidden; + &-child { + position: absolute; - &-oops { - margin-bottom: 20px; - font-size: 32px; - font-weight: bold; - line-height: 40px; - color: $base-color-blue; + &.left { + top: 17px; + left: 220px; + width: 80px; opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; + animation-name: cloudLeft; + animation-duration: 2s; + animation-timing-function: linear; + animation-delay: 1s; animation-fill-mode: forwards; } - &-headline { - margin-bottom: 10px; - font-size: 20px; - font-weight: bold; - line-height: 24px; - color: #222; + &.mid { + top: 10px; + left: 420px; + width: 46px; opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; - animation-delay: 0.1s; + animation-name: cloudMid; + animation-duration: 2s; + animation-timing-function: linear; + animation-delay: 1.2s; animation-fill-mode: forwards; } - &-info { - margin-bottom: 30px; - font-size: 13px; - line-height: 21px; - color: $base-color-gray; + &.right { + top: 100px; + left: 500px; + width: 62px; opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; - animation-delay: 0.2s; + animation-name: cloudRight; + animation-duration: 2s; + animation-timing-function: linear; + animation-delay: 1s; animation-fill-mode: forwards; } - &-return-home { - display: block; - float: left; - width: 110px; - height: 36px; - font-size: 14px; - line-height: 36px; - color: #fff; - text-align: center; - cursor: pointer; - background: $base-color-blue; - border-radius: 100px; - opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; - animation-delay: 0.3s; - animation-fill-mode: forwards; - } - - @keyframes slideUp { + @keyframes cloudLeft { 0% { + top: 17px; + left: 220px; opacity: 0; - transform: translateY(60px); + } + + 20% { + top: 33px; + left: 188px; + opacity: 1; + } + + 80% { + top: 81px; + left: 92px; + opacity: 1; } 100% { + top: 97px; + left: 60px; + opacity: 0; + } + } + + @keyframes cloudMid { + 0% { + top: 10px; + left: 420px; + opacity: 0; + } + + 20% { + top: 40px; + left: 360px; opacity: 1; - transform: translateY(0); + } + + 70% { + top: 130px; + left: 180px; + opacity: 1; + } + + 100% { + top: 160px; + left: 120px; + opacity: 0; + } + } + + @keyframes cloudRight { + 0% { + top: 100px; + left: 500px; + opacity: 0; + } + + 20% { + top: 120px; + left: 460px; + opacity: 1; + } + + 80% { + top: 180px; + left: 340px; + opacity: 1; + } + + 100% { + top: 200px; + left: 300px; + opacity: 0; } } } } + + .bullshit { + position: relative; + float: left; + width: 300px; + padding: 30px 0; + overflow: hidden; + + &-oops { + margin-bottom: 20px; + font-size: 32px; + font-weight: bold; + line-height: 40px; + color: $base-color-blue; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-fill-mode: forwards; + } + + &-headline { + margin-bottom: 10px; + font-size: 20px; + font-weight: bold; + line-height: 24px; + color: #222; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-delay: 0.1s; + animation-fill-mode: forwards; + } + + &-info { + margin-bottom: 30px; + font-size: 13px; + line-height: 21px; + color: $base-color-gray; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-delay: 0.2s; + animation-fill-mode: forwards; + } + + &-return-home { + display: block; + float: left; + width: 110px; + height: 36px; + font-size: 14px; + line-height: 36px; + color: #fff; + text-align: center; + cursor: pointer; + background: $base-color-blue; + border-radius: 100px; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-delay: 0.3s; + animation-fill-mode: forwards; + } + + @keyframes slideUp { + 0% { + opacity: 0; + transform: translateY(60px); + } + + 100% { + opacity: 1; + transform: translateY(0); + } + } + } } +} </style> diff --git a/src/views/404.vue b/src/views/404.vue index 9c261b6..500a7b4 100644 --- a/src/views/404.vue +++ b/src/views/404.vue @@ -43,254 +43,254 @@ </template> <script> - export default { - name: 'Page404', - data() { - return { - jumpTime: 5, - oops: '鎶辨瓑!', - headline: '褰撳墠椤甸潰涓嶅瓨鍦�...', - info: '璇锋鏌ユ偍杈撳叆鐨勭綉鍧�鏄惁姝g‘锛屾垨鐐瑰嚮涓嬮潰鐨勬寜閽繑鍥為椤点��', - btn: '杩斿洖棣栭〉', - timer: 0, - } +export default { + name: "Page404", + data() { + return { + jumpTime: 5, + oops: "鎶辨瓑!", + headline: "褰撳墠椤甸潰涓嶅瓨鍦�...", + info: "璇锋鏌ユ偍杈撳叆鐨勭綉鍧�鏄惁姝g‘锛屾垨鐐瑰嚮涓嬮潰鐨勬寜閽繑鍥為椤点��", + btn: "杩斿洖棣栭〉", + timer: 0, + }; + }, + mounted() { + this.timeChange(); + }, + beforeDestroy() { + clearInterval(this.timer); + }, + methods: { + timeChange() { + this.timer = setInterval(() => { + if (this.jumpTime) { + this.jumpTime--; + } else { + this.$router.push({ path: "/" }); + this.$store.dispatch("tabsBar/delOthersRoutes", { + path: "/", + }); + clearInterval(this.timer); + } + }, 1000); }, - mounted() { - this.timeChange() - }, - beforeDestroy() { - clearInterval(this.timer) - }, - methods: { - timeChange() { - this.timer = setInterval(() => { - if (this.jumpTime) { - this.jumpTime-- - } else { - this.$router.push({ path: '/' }) - this.$store.dispatch('tabsBar/delOthersRoutes', { - path: '/', - }) - clearInterval(this.timer) - } - }, 1000) - }, - }, - } + }, +}; </script> <style lang="scss" scoped> - .error-container { - position: absolute; - top: 40%; - left: 50%; - transform: translate(-50%, -50%); +.error-container { + position: absolute; + top: 40%; + left: 50%; + transform: translate(-50%, -50%); - .error-content { - .pic-error { - position: relative; - float: left; - width: 120%; - overflow: hidden; + .error-content { + .pic-error { + position: relative; + float: left; + width: 120%; + overflow: hidden; - &-parent { - width: 100%; - } - - &-child { - position: absolute; - - &.left { - top: 17px; - left: 220px; - width: 80px; - opacity: 0; - animation-name: cloudLeft; - animation-duration: 2s; - animation-timing-function: linear; - animation-delay: 1s; - animation-fill-mode: forwards; - } - - &.mid { - top: 10px; - left: 420px; - width: 46px; - opacity: 0; - animation-name: cloudMid; - animation-duration: 2s; - animation-timing-function: linear; - animation-delay: 1.2s; - animation-fill-mode: forwards; - } - - &.right { - top: 100px; - left: 500px; - width: 62px; - opacity: 0; - animation-name: cloudRight; - animation-duration: 2s; - animation-timing-function: linear; - animation-delay: 1s; - animation-fill-mode: forwards; - } - - @keyframes cloudLeft { - 0% { - top: 17px; - left: 220px; - opacity: 0; - } - - 20% { - top: 33px; - left: 188px; - opacity: 1; - } - - 80% { - top: 81px; - left: 92px; - opacity: 1; - } - - 100% { - top: 97px; - left: 60px; - opacity: 0; - } - } - - @keyframes cloudMid { - 0% { - top: 10px; - left: 420px; - opacity: 0; - } - - 20% { - top: 40px; - left: 360px; - opacity: 1; - } - - 70% { - top: 130px; - left: 180px; - opacity: 1; - } - - 100% { - top: 160px; - left: 120px; - opacity: 0; - } - } - - @keyframes cloudRight { - 0% { - top: 100px; - left: 500px; - opacity: 0; - } - - 20% { - top: 120px; - left: 460px; - opacity: 1; - } - - 80% { - top: 180px; - left: 340px; - opacity: 1; - } - - 100% { - top: 200px; - left: 300px; - opacity: 0; - } - } - } + &-parent { + width: 100%; } - .bullshit { - position: relative; - float: left; - width: 300px; - padding: 30px 0; - overflow: hidden; + &-child { + position: absolute; - &-oops { - margin-bottom: 20px; - font-size: 32px; - font-weight: bold; - line-height: 40px; - color: $base-color-blue; + &.left { + top: 17px; + left: 220px; + width: 80px; opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; + animation-name: cloudLeft; + animation-duration: 2s; + animation-timing-function: linear; + animation-delay: 1s; animation-fill-mode: forwards; } - &-headline { - margin-bottom: 10px; - font-size: 20px; - font-weight: bold; - line-height: 24px; - color: #222; + &.mid { + top: 10px; + left: 420px; + width: 46px; opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; - animation-delay: 0.1s; + animation-name: cloudMid; + animation-duration: 2s; + animation-timing-function: linear; + animation-delay: 1.2s; animation-fill-mode: forwards; } - &-info { - margin-bottom: 30px; - font-size: 13px; - line-height: 21px; - color: $base-color-gray; + &.right { + top: 100px; + left: 500px; + width: 62px; opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; - animation-delay: 0.2s; + animation-name: cloudRight; + animation-duration: 2s; + animation-timing-function: linear; + animation-delay: 1s; animation-fill-mode: forwards; } - &-return-home { - display: block; - float: left; - width: 110px; - height: 36px; - font-size: 14px; - line-height: 36px; - color: #fff; - text-align: center; - cursor: pointer; - background: $base-color-blue; - border-radius: 100px; - opacity: 0; - animation-name: slideUp; - animation-duration: 0.5s; - animation-delay: 0.3s; - animation-fill-mode: forwards; - } - - @keyframes slideUp { + @keyframes cloudLeft { 0% { + top: 17px; + left: 220px; opacity: 0; - transform: translateY(60px); + } + + 20% { + top: 33px; + left: 188px; + opacity: 1; + } + + 80% { + top: 81px; + left: 92px; + opacity: 1; } 100% { + top: 97px; + left: 60px; + opacity: 0; + } + } + + @keyframes cloudMid { + 0% { + top: 10px; + left: 420px; + opacity: 0; + } + + 20% { + top: 40px; + left: 360px; opacity: 1; - transform: translateY(0); + } + + 70% { + top: 130px; + left: 180px; + opacity: 1; + } + + 100% { + top: 160px; + left: 120px; + opacity: 0; + } + } + + @keyframes cloudRight { + 0% { + top: 100px; + left: 500px; + opacity: 0; + } + + 20% { + top: 120px; + left: 460px; + opacity: 1; + } + + 80% { + top: 180px; + left: 340px; + opacity: 1; + } + + 100% { + top: 200px; + left: 300px; + opacity: 0; } } } } + + .bullshit { + position: relative; + float: left; + width: 300px; + padding: 30px 0; + overflow: hidden; + + &-oops { + margin-bottom: 20px; + font-size: 32px; + font-weight: bold; + line-height: 40px; + color: $base-color-blue; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-fill-mode: forwards; + } + + &-headline { + margin-bottom: 10px; + font-size: 20px; + font-weight: bold; + line-height: 24px; + color: #222; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-delay: 0.1s; + animation-fill-mode: forwards; + } + + &-info { + margin-bottom: 30px; + font-size: 13px; + line-height: 21px; + color: $base-color-gray; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-delay: 0.2s; + animation-fill-mode: forwards; + } + + &-return-home { + display: block; + float: left; + width: 110px; + height: 36px; + font-size: 14px; + line-height: 36px; + color: #fff; + text-align: center; + cursor: pointer; + background: $base-color-blue; + border-radius: 100px; + opacity: 0; + animation-name: slideUp; + animation-duration: 0.5s; + animation-delay: 0.3s; + animation-fill-mode: forwards; + } + + @keyframes slideUp { + 0% { + opacity: 0; + transform: translateY(60px); + } + + 100% { + opacity: 1; + transform: translateY(0); + } + } + } } +} </style> diff --git a/src/views/index/index.vue b/src/views/index/index.vue index 755824f..6771c50 100644 --- a/src/views/index/index.vue +++ b/src/views/index/index.vue @@ -4,8 +4,8 @@ <script> export default { - name: '', -} + name: "", +}; </script> <style></style> diff --git a/src/views/login/index.vue b/src/views/login/index.vue index dd99764..33680f1 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -74,254 +74,254 @@ </template> <script> - import { isPassword } from '@/utils/validate' +import { isPassword } from "@/utils/validate"; - export default { - name: 'Login', - directives: { - focus: { - inserted(el) { - el.querySelector('input').focus() - }, +export default { + name: "Login", + directives: { + focus: { + inserted(el) { + el.querySelector("input").focus(); }, }, - data() { - const validateusername = (rule, value, callback) => { - if ('' == value) { - callback(new Error('鐢ㄦ埛鍚嶄笉鑳戒负绌�')) + }, + data() { + const validateusername = (rule, value, callback) => { + if ("" == value) { + callback(new Error("鐢ㄦ埛鍚嶄笉鑳戒负绌�")); + } else { + callback(); + } + }; + const validatePassword = (rule, value, callback) => { + if (!isPassword(value)) { + callback(new Error("瀵嗙爜涓嶈兘灏戜簬6浣�")); + } else { + callback(); + } + }; + return { + nodeEnv: process.env.NODE_ENV, + title: this.$baseTitle, + form: { + username: "", + password: "", + }, + rules: { + username: [ + { + required: true, + trigger: "blur", + validator: validateusername, + }, + ], + password: [ + { + required: true, + trigger: "blur", + validator: validatePassword, + }, + ], + }, + loading: false, + passwordType: "password", + redirect: undefined, + }; + }, + watch: { + $route: { + handler(route) { + this.redirect = (route.query && route.query.redirect) || "/"; + }, + immediate: true, + }, + }, + created() { + document.body.style.overflow = "hidden"; + }, + beforeDestroy() { + document.body.style.overflow = "auto"; + }, + mounted() { + this.form.username = "admin"; + this.form.password = "123456"; + setTimeout(() => { + this.handleLogin(); + }, 3000); + }, + methods: { + handlePassword() { + this.passwordType === "password" + ? (this.passwordType = "") + : (this.passwordType = "password"); + this.$nextTick(() => { + this.$refs.password.focus(); + }); + }, + handleLogin() { + this.$refs.form.validate((valid) => { + if (valid) { + this.loading = true; + this.$store + .dispatch("user/login", this.form) + .then(() => { + const routerPath = + this.redirect === "/404" || this.redirect === "/401" + ? "/" + : this.redirect; + this.$router.push(routerPath).catch(() => {}); + this.loading = false; + }) + .catch(() => { + this.loading = false; + }); } else { - callback() + return false; } - } - const validatePassword = (rule, value, callback) => { - if (!isPassword(value)) { - callback(new Error('瀵嗙爜涓嶈兘灏戜簬6浣�')) - } else { - callback() - } - } - return { - nodeEnv: process.env.NODE_ENV, - title: this.$baseTitle, - form: { - username: '', - password: '', - }, - rules: { - username: [ - { - required: true, - trigger: 'blur', - validator: validateusername, - }, - ], - password: [ - { - required: true, - trigger: 'blur', - validator: validatePassword, - }, - ], - }, - loading: false, - passwordType: 'password', - redirect: undefined, - } + }); }, - watch: { - $route: { - handler(route) { - this.redirect = (route.query && route.query.redirect) || '/' - }, - immediate: true, - }, - }, - created() { - document.body.style.overflow = 'hidden' - }, - beforeDestroy() { - document.body.style.overflow = 'auto' - }, - mounted() { - this.form.username = 'admin' - this.form.password = '123456' - setTimeout(() => { - this.handleLogin() - }, 3000) - }, - methods: { - handlePassword() { - this.passwordType === 'password' - ? (this.passwordType = '') - : (this.passwordType = 'password') - this.$nextTick(() => { - this.$refs.password.focus() - }) - }, - handleLogin() { - this.$refs.form.validate((valid) => { - if (valid) { - this.loading = true - this.$store - .dispatch('user/login', this.form) - .then(() => { - const routerPath = - this.redirect === '/404' || this.redirect === '/401' - ? '/' - : this.redirect - this.$router.push(routerPath).catch(() => {}) - this.loading = false - }) - .catch(() => { - this.loading = false - }) - } else { - return false - } - }) - }, - }, - } + }, +}; </script> <style lang="scss" scoped> - .login-container { - height: 100vh; - background: url('~@/assets/login_images/background.jpg') center center fixed - no-repeat; - background-size: cover; +.login-container { + height: 100vh; + background: url("~@/assets/login_images/background.jpg") center center fixed + no-repeat; + background-size: cover; - .title { - font-size: 54px; - font-weight: 500; - color: rgba(14, 18, 26, 1); + .title { + font-size: 54px; + font-weight: 500; + color: rgba(14, 18, 26, 1); + } + + .title-tips { + margin-top: 29px; + font-size: 26px; + font-weight: 400; + color: rgba(14, 18, 26, 1); + text-overflow: ellipsis; + white-space: nowrap; + } + + .login-btn { + display: inherit; + width: 220px; + height: 60px; + margin-top: 5px; + border: 0; + + &:hover { + opacity: 0.9; } + } - .title-tips { - margin-top: 29px; - font-size: 26px; - font-weight: 400; - color: rgba(14, 18, 26, 1); - text-overflow: ellipsis; - white-space: nowrap; - } + .login-form { + position: relative; + max-width: 100%; + margin: calc((100vh - 425px) / 2) 10% 10%; + overflow: hidden; - .login-btn { - display: inherit; - width: 220px; - height: 60px; - margin-top: 5px; - border: 0; + .forget-password { + width: 100%; + margin-top: 40px; + text-align: left; - &:hover { - opacity: 0.9; - } - } - - .login-form { - position: relative; - max-width: 100%; - margin: calc((100vh - 425px) / 2) 10% 10%; - overflow: hidden; - - .forget-password { - width: 100%; - margin-top: 40px; - text-align: left; - - .forget-pass { - width: 129px; - height: 19px; - font-size: 20px; - font-weight: 400; - color: rgba(92, 102, 240, 1); - } - } - } - - .tips { - margin-bottom: 10px; - font-size: $base-font-size-default; - color: $base-color-white; - - span { - &:first-of-type { - margin-right: 16px; - } - } - } - - .title-container { - position: relative; - - .title { - margin: 0 auto 40px auto; - font-size: 34px; - font-weight: bold; - color: $base-color-blue; - text-align: center; - } - } - - .svg-container { - position: absolute; - top: 14px; - left: 15px; - z-index: $base-z-index; - font-size: 16px; - color: #d7dee3; - cursor: pointer; - user-select: none; - } - - .show-password { - position: absolute; - top: 14px; - right: 25px; - font-size: 16px; - color: #d7dee3; - cursor: pointer; - user-select: none; - } - - ::v-deep { - .el-form-item { - padding-right: 0; - margin: 20px 0; - color: #454545; - background: transparent; - border: 1px solid transparent; - border-radius: 2px; - - &__content { - min-height: $base-input-height; - line-height: $base-input-height; - } - - &__error { - position: absolute; - top: 100%; - left: 18px; - font-size: $base-font-size-small; - line-height: 18px; - color: $base-color-red; - } - } - - .el-input { - box-sizing: border-box; - - input { - height: 58px; - padding-left: 45px; - font-size: $base-font-size-default; - line-height: 58px; - color: $base-font-color; - background: #f6f4fc; - border: 0; - caret-color: $base-font-color; - } + .forget-pass { + width: 129px; + height: 19px; + font-size: 20px; + font-weight: 400; + color: rgba(92, 102, 240, 1); } } } + + .tips { + margin-bottom: 10px; + font-size: $base-font-size-default; + color: $base-color-white; + + span { + &:first-of-type { + margin-right: 16px; + } + } + } + + .title-container { + position: relative; + + .title { + margin: 0 auto 40px auto; + font-size: 34px; + font-weight: bold; + color: $base-color-blue; + text-align: center; + } + } + + .svg-container { + position: absolute; + top: 14px; + left: 15px; + z-index: $base-z-index; + font-size: 16px; + color: #d7dee3; + cursor: pointer; + user-select: none; + } + + .show-password { + position: absolute; + top: 14px; + right: 25px; + font-size: 16px; + color: #d7dee3; + cursor: pointer; + user-select: none; + } + + ::v-deep { + .el-form-item { + padding-right: 0; + margin: 20px 0; + color: #454545; + background: transparent; + border: 1px solid transparent; + border-radius: 2px; + + &__content { + min-height: $base-input-height; + line-height: $base-input-height; + } + + &__error { + position: absolute; + top: 100%; + left: 18px; + font-size: $base-font-size-small; + line-height: 18px; + color: $base-color-red; + } + } + + .el-input { + box-sizing: border-box; + + input { + height: 58px; + padding-left: 45px; + font-size: $base-font-size-default; + line-height: 58px; + color: $base-font-color; + background: #f6f4fc; + border: 0; + caret-color: $base-font-color; + } + } + } +} </style> diff --git a/src/views/project/components/ProjectEdit.vue b/src/views/project/components/ProjectEdit.vue index d2740b4..92a7ace 100644 --- a/src/views/project/components/ProjectEdit.vue +++ b/src/views/project/components/ProjectEdit.vue @@ -19,7 +19,10 @@ <el-input v-model.trim="form.srcUser" autocomplete="off"></el-input> </el-form-item> <el-form-item label="椤圭洰瀵嗙爜" prop="srcPassword"> - <el-input v-model.trim="form.srcPassword" autocomplete="off"></el-input> + <el-input + v-model.trim="form.srcPassword" + autocomplete="off" + ></el-input> </el-form-item> <el-form-item label="椤圭洰鎻忚堪" prop="desc"> <el-input v-model.trim="form.desc" autocomplete="off"></el-input> @@ -61,59 +64,59 @@ </template> <script> -import { doEdit } from '@/api/project' +import { doEdit } from "@/api/project"; export default { - name: 'ProjectEdit', + name: "ProjectEdit", data() { return { - activeName: 'base', + activeName: "base", form: { - title: '', - author: '', + title: "", + author: "", }, rules: { - title: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ユ爣棰�' }], - author: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ヤ綔鑰�' }], + title: [{ required: true, trigger: "blur", message: "璇疯緭鍏ユ爣棰�" }], + author: [{ required: true, trigger: "blur", message: "璇疯緭鍏ヤ綔鑰�" }], }, - title: '', + title: "", dialogFormVisible: false, - } + }; }, - created() { }, + created() {}, methods: { showEdit(row) { if (!row) { - this.title = '娣诲姞' + this.title = "娣诲姞"; } else { - this.title = '缂栬緫' - this.form = Object.assign({}, row) + this.title = "缂栬緫"; + this.form = Object.assign({}, row); } - this.dialogFormVisible = true + this.dialogFormVisible = true; }, close() { - this.$refs['form'].resetFields() - this.form = this.$options.data().form - this.dialogFormVisible = false - this.$emit('fetch-data') + this.$refs["form"].resetFields(); + this.form = this.$options.data().form; + this.dialogFormVisible = false; + this.$emit("fetch-data"); }, save() { - this.$refs['form'].validate(async (valid) => { + this.$refs["form"].validate(async (valid) => { if (valid) { - const { msg } = await doEdit(this.form) - this.$baseMessage(msg, 'success') - this.$refs['form'].resetFields() - this.dialogFormVisible = false - this.$emit('fetch-data') - this.form = this.$options.data().form + const { msg } = await doEdit(this.form); + this.$baseMessage(msg, "success"); + this.$refs["form"].resetFields(); + this.dialogFormVisible = false; + this.$emit("fetch-data"); + this.form = this.$options.data().form; } else { - return false + return false; } - }) + }); }, handleClick(tab, event) { // console.log(tab, event) }, }, -} +}; </script> diff --git a/src/views/project/index.vue b/src/views/project/index.vue index 8df14be..6c2c5d8 100644 --- a/src/views/project/index.vue +++ b/src/views/project/index.vue @@ -2,7 +2,12 @@ <div class="table-container"> <vab-query-form> <vab-query-form-left-panel> - <el-form ref="form" :model="queryForm" :inline="true" @submit.native.prevent> + <el-form + ref="form" + :model="queryForm" + :inline="true" + @submit.native.prevent + > <el-form-item> <el-input v-model="queryForm.title" placeholder="鍚嶇О" /> </el-form-item> @@ -24,14 +29,18 @@ type="primary" native-type="submit" @click="handleQuery" - >鏌ヨ</el-button> + >鏌ヨ</el-button + > </el-form-item> </el-form> </vab-query-form-left-panel> <vab-query-form-right-panel> <el-button icon="el-icon-plus" type="primary" @click="handleAdd"> - 娣诲姞</el-button> - <el-button icon="el-icon-delete" type="danger" @click="handleDelete">鍒犻櫎</el-button> + 娣诲姞</el-button + > + <el-button icon="el-icon-delete" type="danger" @click="handleDelete" + >鍒犻櫎</el-button + > </vab-query-form-right-panel> </vab-query-form> @@ -47,7 +56,11 @@ > <el-table-column type="expand"> <template slot-scope="props"> - <el-table :data="props.row.pkgList" :show-header="false" style="width: 100%"> + <el-table + :data="props.row.pkgList" + :show-header="false" + style="width: 100%" + > <el-table-column prop="fileName"></el-table-column> <el-table-column prop="version" width="150"></el-table-column> <el-table-column prop="commit" width="150"></el-table-column> @@ -58,9 +71,14 @@ <el-tag>{{ packageState[row.state] }}</el-tag> </template> </el-table-column> - <el-table-column width="120"> + <el-table-column width="200"> <template #default="scope"> - <el-button size="small" @click="handlePublish(scope.row)">鍙戝竷</el-button> + <el-button size="small" @click="handlePublish(scope.row)" + >鍙戝竷</el-button + > + <el-button size="small" @click="handleDownload(scope.row)" + >涓嬭浇</el-button + > </template> </el-table-column> </el-table> @@ -70,8 +88,16 @@ <el-table-column show-overflow-tooltip label="搴忓彿" width="95"> <template #default="scope">{{ scope.$index + 1 }}</template> </el-table-column> - <el-table-column show-overflow-tooltip prop="name" label="椤圭洰鍚嶇О"></el-table-column> - <el-table-column show-overflow-tooltip prop="srcUrl" label="椤圭洰鍦板潃"></el-table-column> + <el-table-column + show-overflow-tooltip + prop="name" + label="椤圭洰鍚嶇О" + ></el-table-column> + <el-table-column + show-overflow-tooltip + prop="srcUrl" + label="椤圭洰鍦板潃" + ></el-table-column> <el-table-column show-overflow-tooltip prop="type" label="绫诲瀷"> <template #default="{ row }"> <el-tag>{{ row.type | typeFilter }}</el-tag> @@ -83,12 +109,26 @@ <el-tag>{{ row.state | stateFilter }}</el-tag> </template> </el-table-column> - <el-table-column label="鍒涘缓鏃堕棿" prop="createdAt" width="200"></el-table-column> + <el-table-column + label="鍒涘缓鏃堕棿" + prop="createdAt" + width="200" + ></el-table-column> <el-table-column label="鎿嶄綔" width="180px"> <template #default="{ row }"> <el-button type="text" @click="handleEdit(row)">缂栬緫</el-button> - <el-button type="text" style="color: red" @click="handleDeleteRow(row)">鍒犻櫎</el-button> - <el-button type="text" style="color: deepskyblue" @click="handlePack(row)">鎵撳寘</el-button> + <el-button + type="text" + style="color: red" + @click="handleDeleteRow(row)" + >鍒犻櫎</el-button + > + <el-button + type="text" + style="color: deepskyblue" + @click="handlePack(row)" + >鎵撳寘</el-button + > </template> </el-table-column> </el-table> @@ -106,28 +146,28 @@ </template> <script> -import { getList, deletePrj, getPkgList, buildPkg } from '@/api/project' -import { publish } from '@/api/package' +import { getList, deletePrj, getPkgList, buildPkg } from "@/api/project"; +import { publish, download } from "@/api/package"; -import TableEdit from './components/ProjectEdit.vue' +import TableEdit from "./components/ProjectEdit.vue"; export default { - name: 'ComprehensiveTable', + name: "ComprehensiveTable", components: { TableEdit, }, filters: { stateFilter(state) { - const stateMap = ['涓嬭浇涓�', '鍚屾瀹屾垚', '鍚屾澶辫触'] + const stateMap = ["涓嬭浇涓�", "鍚屾瀹屾垚", "鍚屾澶辫触"]; - return stateMap[state] + return stateMap[state]; }, typeFilter(type) { const typeMap = { - sys: '绯荤粺鍖�', - app: '搴旂敤鍖�', - algo: '绠楁硶鍖�', - } - return typeMap[type] + sys: "绯荤粺鍖�", + app: "搴旂敤鍖�", + algo: "绠楁硶鍖�", + }; + return typeMap[type]; }, }, data() { @@ -135,137 +175,147 @@ imgShow: true, list: [], listLoading: true, - layout: 'total, sizes, prev, pager, next, jumper', + layout: "total, sizes, prev, pager, next, jumper", packageState: [ - '瀹屾垚', - '宸叉彁浜�', - '鎺掗槦涓�', - '鎵撳寘涓�', - '缂栬瘧澶辫触', - '鎵撳寘澶辫触', + "瀹屾垚", + "宸叉彁浜�", + "鎺掗槦涓�", + "鎵撳寘涓�", + "缂栬瘧澶辫触", + "鎵撳寘澶辫触", ], total: 0, background: true, - selectRows: '', - elementLoadingText: '姝e湪鍔犺浇...', + selectRows: "", + elementLoadingText: "姝e湪鍔犺浇...", queryForm: { pageNo: 1, pageSize: 20, - title: '', + title: "", }, - } + }; }, computed: { height() { - return this.$baseTableHeight() + return this.$baseTableHeight(); }, }, created() { - this.fetchData() + this.fetchData(); }, - beforeDestroy() { }, - mounted() { }, + beforeDestroy() {}, + mounted() {}, methods: { setSelectRows(val) { - this.selectRows = val + this.selectRows = val; }, handleAdd() { - this.$refs['edit'].showEdit() + this.$refs["edit"].showEdit(); }, handleEdit(row) { - this.$refs['edit'].showEdit(row) + this.$refs["edit"].showEdit(row); }, handleDelete(row) { if (this.selectRows.length > 0) { - const ids = this.selectRows.map((item) => item.id).join() - this.$baseConfirm('浣犵‘瀹氳鍒犻櫎閫変腑椤瑰悧', null, async () => { - const { msg } = await doDelete({ ids: ids }) - this.$baseMessage(msg, 'success') - this.fetchData() - }) + const ids = this.selectRows.map((item) => item.id).join(); + this.$baseConfirm("浣犵‘瀹氳鍒犻櫎閫変腑椤瑰悧", null, async () => { + const { msg } = await doDelete({ ids: ids }); + this.$baseMessage(msg, "success"); + this.fetchData(); + }); } else { - this.$baseMessage('鏈�変腑浠讳綍琛�', 'error') - return false + this.$baseMessage("鏈�変腑浠讳綍琛�", "error"); + return false; } }, handleDeleteRow(row) { if (row.id) { - this.$baseConfirm('浣犵‘瀹氳鍒犻櫎褰撳墠椤瑰悧', null, async () => { - const { msg } = await deletePrj(row.id) - this.$baseMessage(msg, 'success') - this.fetchData() - }) + this.$baseConfirm("浣犵‘瀹氳鍒犻櫎褰撳墠椤瑰悧", null, async () => { + const { msg } = await deletePrj(row.id); + this.$baseMessage(msg, "success"); + this.fetchData(); + }); } }, handleSizeChange(val) { - this.queryForm.pageSize = val - this.fetchData() + this.queryForm.pageSize = val; + this.fetchData(); }, handleCurrentChange(val) { - this.queryForm.pageNo = val - this.fetchData() + this.queryForm.pageNo = val; + this.fetchData(); }, handleQuery() { - this.queryForm.pageNo = 1 - this.fetchData() + this.queryForm.pageNo = 1; + this.fetchData(); }, async fetchData() { - this.listLoading = true - const { data, total } = await getList(this.queryForm) + this.listLoading = true; + const { data, total } = await getList(this.queryForm); if (data) { data.forEach((item) => { - item.pkgList = [] - }) + item.pkgList = []; + }); - this.list = data + this.list = data; } - this.total = total + this.total = total; setTimeout(() => { - this.listLoading = false - }, 500) + this.listLoading = false; + }, 500); }, async expandChange(row, expandRows) { - console.log(row) + console.log(row); if (expandRows.length == 0) { - console.log('fold') - return + console.log("fold"); + return; } - const { data, total } = await getPkgList(row.id) + const { data, total } = await getPkgList(row.id); this.list.forEach((item, idx) => { if (item.id === row.id) { - this.list[idx].pkgList = data + this.list[idx].pkgList = data; } - }) + }); }, handlePack(row) { - this.$prompt('璇疯緭鍏ョ増鏈彿', '鎻愮ず', { - confirmButtonText: '纭畾', - cancelButtonText: '鍙栨秷', + this.$prompt("璇疯緭鍏ョ増鏈彿", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", inputPattern: /[\d+][\.\d+]*/, - inputErrorMessage: '鐗堟湰鍙锋牸寮忎笉姝g‘,渚� 1.0.0, 10.1.100', + inputErrorMessage: "鐗堟湰鍙锋牸寮忎笉姝g‘,渚� 1.0.0, 10.1.100", }) .then(({ value }) => { buildPkg(row, value).then((rsp) => { - console.log(rsp) - this.expandChange(row, 1) - }) + console.log(rsp); + this.expandChange(row, 1); + }); }) .catch(() => { this.$message({ - type: 'info', - message: '鍙栨秷杈撳叆', - }) - }) + type: "info", + message: "鍙栨秷杈撳叆", + }); + }); }, handlePublish(row) { publish(row).then((rsp) => { - console.log(rsp) - }) + if (rsp && rsp.success) { + this.$baseMessage(rsp.msg, "success"); + } + }); + }, + handleDownload(row) { + download({ path: row.filePath }).then((rsp) => { + if (rsp && rsp.success) { + console.log(rsp); + window.location = rsp.data; + } + }); }, }, -} +}; </script> -- Gitblit v1.8.0