diff --git a/hx-ai-intelligent/public/asset/image/login/background.png b/hx-ai-intelligent/public/asset/image/login/background.png index 48446c8..ca0ab24 100644 Binary files a/hx-ai-intelligent/public/asset/image/login/background.png and b/hx-ai-intelligent/public/asset/image/login/background.png differ diff --git a/hx-ai-intelligent/public/asset/image/login/lg-card-bg.png b/hx-ai-intelligent/public/asset/image/login/lg-card-bg.png new file mode 100644 index 0000000..26f57e7 Binary files /dev/null and b/hx-ai-intelligent/public/asset/image/login/lg-card-bg.png differ diff --git a/hx-ai-intelligent/src/config/app.config.ts b/hx-ai-intelligent/src/config/app.config.ts index 4f834e7..3c63cc0 100644 --- a/hx-ai-intelligent/src/config/app.config.ts +++ b/hx-ai-intelligent/src/config/app.config.ts @@ -18,6 +18,7 @@ const transform = (data, map) => { export const appConfig = { projectType: 'web', baseApi: '/api', + projectName: '济阳站_AI智能BAS系统', enablePermissions: true, // themeColor: '#eee', siderPosition: 'left', diff --git a/hx-ai-intelligent/src/icon/passWord.svg b/hx-ai-intelligent/src/icon/passWord.svg index 5e632d7..1c4f2cb 100644 --- a/hx-ai-intelligent/src/icon/passWord.svg +++ b/hx-ai-intelligent/src/icon/passWord.svg @@ -1,5 +1,4 @@ - - - + + + - diff --git a/hx-ai-intelligent/src/icon/userName.svg b/hx-ai-intelligent/src/icon/userName.svg index 6546d34..7891f5c 100644 --- a/hx-ai-intelligent/src/icon/userName.svg +++ b/hx-ai-intelligent/src/icon/userName.svg @@ -1,5 +1,4 @@ - - - + + + - diff --git a/hx-ai-intelligent/src/icon/verifyIcon.svg b/hx-ai-intelligent/src/icon/verifyIcon.svg new file mode 100644 index 0000000..b19e455 --- /dev/null +++ b/hx-ai-intelligent/src/icon/verifyIcon.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/hx-ai-intelligent/src/theme/variable.less b/hx-ai-intelligent/src/theme/variable.less index dba1764..da74e0b 100644 --- a/hx-ai-intelligent/src/theme/variable.less +++ b/hx-ai-intelligent/src/theme/variable.less @@ -1,7 +1,7 @@ // @import "./global-antd.less"; -@primary-color: #ff7602; // 全局主色 -@layout-header-hover: #924908; //hover -@layout-header-background: #111519; // 头部背景色 +// @primary-color: #ff7602; // 全局主色 +// @layout-header-hover: #924908; //hover +// @layout-header-background: #111519; // 头部背景色 // @layout-header-background:url(/asset/image/header_background.png) no-repeat; // @ant-layout-sider-collapsed-background:url(/asset/image/sider_collapsed_background.png) no-repeat; diff --git a/hx-op/src/config/app.config.ts b/hx-op/src/config/app.config.ts index ac09132..1c26493 100644 --- a/hx-op/src/config/app.config.ts +++ b/hx-op/src/config/app.config.ts @@ -12,6 +12,7 @@ const transform = (data, map) => { }; export const appConfig = { projectType: 'web', + projectName: '济阳站_AI智能BAS系统', baseApi: '/api', enablePermissions: false, // themeColor: '#eee', diff --git a/lib/component/index.ts b/lib/component/index.ts index 6ca7a93..39e3f5f 100644 --- a/lib/component/index.ts +++ b/lib/component/index.ts @@ -67,6 +67,7 @@ export { NsVNode } from './VNode'; export { NsMessage } from './message'; export { NsModal } from './modal'; export { NsDrawer } from './drawer'; +export { NsVerify } from './verify'; export { NsForm } from './form/form'; export * from './table'; diff --git a/lib/component/verify/index.ts b/lib/component/verify/index.ts new file mode 100644 index 0000000..26bb3d5 --- /dev/null +++ b/lib/component/verify/index.ts @@ -0,0 +1,4 @@ +import verify from './verify.vue'; +import { withInstall } from '/nerv-lib/util'; + +export const NsVerify = withInstall(verify); diff --git a/lib/component/verify/verify.vue b/lib/component/verify/verify.vue new file mode 100644 index 0000000..3cadcf0 --- /dev/null +++ b/lib/component/verify/verify.vue @@ -0,0 +1,127 @@ +
+ +
+ + + + diff --git a/lib/saas/store/modules/app-config.ts b/lib/saas/store/modules/app-config.ts index 4575667..9648d39 100644 --- a/lib/saas/store/modules/app-config.ts +++ b/lib/saas/store/modules/app-config.ts @@ -4,6 +4,7 @@ import { useApi, HttpRequestConfig } from '/nerv-lib/use/use-api'; interface AppConfig { projectType: string; + projectName: string; baseApi: string; timeout: number; pagePermission: boolean; diff --git a/lib/saas/theme/variable.less b/lib/saas/theme/variable.less index 89021ca..c7e57cc 100644 --- a/lib/saas/theme/variable.less +++ b/lib/saas/theme/variable.less @@ -1,4 +1,4 @@ -@primary-color: #37abc4; // 全局主色 +@primary-color: #2778FF; // 全局主色 @white: #fff; @black: #000; @@ -25,6 +25,9 @@ // Border color @border-color-base: hsv(0, 0, 85%); // base border outline a component +// border +@border-radius-base: 4px; + //btn //@btn-disable-color: #9b9b9b; //禁用按钮color //@btn-disable-bg: #f5f5f5; //禁用按钮background diff --git a/lib/saas/view/system/login.vue b/lib/saas/view/system/login.vue index d17e189..31bf429 100644 --- a/lib/saas/view/system/login.vue +++ b/lib/saas/view/system/login.vue @@ -16,24 +16,31 @@ backgroundSize: 'cover', }">
-

账号登录

+

{{ configStore.projectName }}

{{ errorMsg }}

-

用户名/手机号

- + + -

密码

- + + + + + + + + (''); const initUrl = ref(''); + const verifyCode = ref(''); + const code = ref(); title.value = '账号登录'; // title.value = appConfig.title ? appConfig.title : '账号登录'; const loading = ref(false); const configStore = appConfigStore(); - const { getThemeConfig: themeConfig } = storeToRefs(configStore); + console.log(configStore); + + const { getThemeConfig: themeConfig, projectName } = storeToRefs(configStore); + const useAuthorization = authorizationService(); const submit = (): void => { if (password.value === '') { errorMsg.value = '请输入密码'; errorShow.value = true; + return; } if (userName.value === '') { errorMsg.value = '请输入账号'; errorShow.value = true; + return; + } + if (!code.value) { + errorMsg.value = '请输入验证码'; + errorShow.value = true; + return; + } + if (code.value.toLocaleLowerCase() !== verifyCode.value.toLocaleLowerCase()) { + errorMsg.value = '请输入正确的验证码'; + errorShow.value = true; + return; } if (userName.value !== '' && password.value !== '') { errorShow.value = false; @@ -159,7 +183,13 @@ ? (url.value = 'src/assetimg/background.jpg') : (url.value = 'src/assetimg/background.png'); }; + const onGetCode = (res) => { + verifyCode.value = res; + }; return { + projectName, + onGetCode, + code, title, themeConfig, url, @@ -173,6 +203,7 @@ checkoutLogo, checkoutBg, errorShow, + configStore, }; }, created() { @@ -219,12 +250,12 @@ // border-radius: 50%; } - .lg_card .loginIcon { - color: @primary-color !important; - } + // .lg_card .loginIcon { + // color: @primary-color !important; + // } .ant-layout-header { min-height: 64px; - background: #fff !important; + // background: #fff !important; } .ant-layout-content { @@ -234,7 +265,7 @@ display: flex; align-items: center; justify-content: flex-end; - padding-right: 100px; + padding-right: 10%; } .ant-layout-footer { @@ -250,32 +281,56 @@ } .lg_card { - width: 385px; - height: 409px; + width: 500px; + height: 570px; background: #fff; box-shadow: 0 2px 2px 0 rgb(0 0 0 / 5%), 0 0 18px 0 rgb(0 0 0 / 8%); border-radius: 6px; - margin: 0 30px 0 30px; - padding: 35px; + padding: 50px; + border-radius: 10px; + // background: ; + + border: 3px solid rgba(255, 255, 255, 1); + .lg_card_tip { color: #a7b6c9; margin-bottom: 12px; } + + .loginInfo { + height: 48px; + width: 100%; + margin-bottom: 31px; + :deep(.ant-input) { + font-size: 16px !important; + } + :deep(.ant-input-group) { + height: 100%; + .ant-input-affix-wrapper { + height: 100%; + } + .ant-input-group-addon { + padding: 0; + } + } + } } .lg_card .lg_card_title { - height: 28px; - font-size: 20px; - font-weight: bold; - color: #172e3d; - line-height: 28px; - text-align: left; + text-align: center; + font-size: 32px; + font-weight: 700; + letter-spacing: 0px; + line-height: 42px; + color: @primary-color; + text-align: center; + vertical-align: top; } .lg_card_error { text-align: left; - color: #e4393c; - font-size: 14px; + color: #e00e12; + font-size: 16px; } .lg_card .loginIcon { color: @primary-color !important;