diff --git a/.env.development b/.env.development index fa857bf28..a51ff1e33 100644 --- a/.env.development +++ b/.env.development @@ -9,4 +9,5 @@ VUE_APP_API_SERVER = http://192.168.1.140/api # VUE_APP_API_SERVER = https://epmet-dev.elinkservice.cn/api VUE_APP_NODE_ENV=dev #项目根路径 -VUE_APP_PUBLIC_PATH=epmet-oper \ No newline at end of file +VUE_APP_PUBLIC_PATH=epmet-oper +VUE_APP_CUSTOMER=yantai \ No newline at end of file diff --git a/.env.production b/.env.production index fca313993..f0dd6e5e6 100644 --- a/.env.production +++ b/.env.production @@ -2,3 +2,4 @@ NODE_ENV=production VUE_APP_API_SERVER = https://epmet-yantai.elinkservice.cn/api VUE_APP_NODE_ENV=prod VUE_APP_PUBLIC_PATH=epmet-oper +VUE_APP_CUSTOMER=yantai diff --git a/.env.production.sit b/.env.production.sit index b0c600ea6..9edee48dd 100644 --- a/.env.production.sit +++ b/.env.production.sit @@ -2,4 +2,5 @@ NODE_ENV=production # VUE_APP_API_SERVER = https://epmet-test.elinkservice.cn/api VUE_APP_API_SERVER = http://192.168.1.140/api VUE_APP_NODE_ENV=prod:sit -VUE_APP_PUBLIC_PATH=epmet-oper \ No newline at end of file +VUE_APP_PUBLIC_PATH=epmet-oper +VUE_APP_CUSTOMER=yantai \ No newline at end of file diff --git a/.env.production.uat b/.env.production.uat index 83e93d4d1..7b14d657d 100644 --- a/.env.production.uat +++ b/.env.production.uat @@ -2,4 +2,5 @@ NODE_ENV=production # VUE_APP_API_SERVER = http://120.27.18.76/api VUE_APP_API_SERVER = https://epmet-test.elinkservice.cn/api VUE_APP_NODE_ENV=prod:uat -VUE_APP_PUBLIC_PATH=epmet-oper \ No newline at end of file +VUE_APP_PUBLIC_PATH=epmet-oper +VUE_APP_CUSTOMER=yantai diff --git a/package.json b/package.json index 3def21d39..f646f014c 100644 --- a/package.json +++ b/package.json @@ -36,6 +36,7 @@ "mint-ui": "^2.2.13", "node-sass": "^4.12.0", "ol": "^6.9.0", + "particles.js": "^2.0.0", "portfinder": "^1.0.21", "qs": "^6.7.0", "quill": "^1.3.6", diff --git a/public/index.html b/public/index.html index 012587ee5..3f25f83a1 100644 --- a/public/index.html +++ b/public/index.html @@ -7,6 +7,10 @@ + diff --git a/src/assets/img/yantai/index/bg.png b/src/assets/img/yantai/index/bg.png new file mode 100644 index 000000000..82f6f5d03 Binary files /dev/null and b/src/assets/img/yantai/index/bg.png differ diff --git a/src/assets/img/yantai/index/db.png b/src/assets/img/yantai/index/db.png new file mode 100644 index 000000000..679fd8724 Binary files /dev/null and b/src/assets/img/yantai/index/db.png differ diff --git a/src/assets/img/yantai/index/guanli.png b/src/assets/img/yantai/index/guanli.png new file mode 100644 index 000000000..c596ecf24 Binary files /dev/null and b/src/assets/img/yantai/index/guanli.png differ diff --git a/src/assets/img/yantai/index/shuju.png b/src/assets/img/yantai/index/shuju.png new file mode 100644 index 000000000..c57b52e0c Binary files /dev/null and b/src/assets/img/yantai/index/shuju.png differ diff --git a/src/assets/img/yantai/index/you.png b/src/assets/img/yantai/index/you.png new file mode 100644 index 000000000..7eb7242ce Binary files /dev/null and b/src/assets/img/yantai/index/you.png differ diff --git a/src/assets/img/yantai/index/yuanhu-you.png b/src/assets/img/yantai/index/yuanhu-you.png new file mode 100644 index 000000000..7ba616c01 Binary files /dev/null and b/src/assets/img/yantai/index/yuanhu-you.png differ diff --git a/src/assets/img/yantai/index/yuanhu-zuo.png b/src/assets/img/yantai/index/yuanhu-zuo.png new file mode 100644 index 000000000..f32150814 Binary files /dev/null and b/src/assets/img/yantai/index/yuanhu-zuo.png differ diff --git a/src/assets/img/yantai/index/zuo.png b/src/assets/img/yantai/index/zuo.png new file mode 100644 index 000000000..8a9b1952a Binary files /dev/null and b/src/assets/img/yantai/index/zuo.png differ diff --git a/src/assets/img/yantai/login/bg.jpg b/src/assets/img/yantai/login/bg.jpg new file mode 100644 index 000000000..595034d62 Binary files /dev/null and b/src/assets/img/yantai/login/bg.jpg differ diff --git a/src/assets/img/yantai/login/bg.png b/src/assets/img/yantai/login/bg.png new file mode 100644 index 000000000..b66d4a657 Binary files /dev/null and b/src/assets/img/yantai/login/bg.png differ diff --git a/src/assets/scss/pages/yantai-index.scss b/src/assets/scss/pages/yantai-index.scss new file mode 100644 index 000000000..d72f4162d --- /dev/null +++ b/src/assets/scss/pages/yantai-index.scss @@ -0,0 +1,185 @@ +@import "~@/assets/scss/c/config.scss"; +@import "~@/assets/scss/c/function.scss"; + +.g-cnt { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-image: url(~@/assets/img/yantai/index/bg.png); + background-size: cover; + background-position: center; +} + +.m-top { + position: absolute; + top: 0; + width: 1920px; + left: -1000px; + right: -1000px; + margin: 0 auto; + + .name { + position: absolute; + top: 0; + left: 0; + text-align: center; + width: 100%; + line-height: 90px; + font-size: 42px; + font-weight: bold; + color: #fff; + background-image: -webkit-linear-gradient(bottom, rgb(23, 222, 238), rgb(23, 222, 238), #fff, #fff); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + } +} + +.m-list { + position: absolute; + top: 50%; + left: 0; + right: 0; + margin: auto; + transform: translateY(-50%); + + .list { + display: flex; + justify-content: space-around; + align-items: center; + width: 100%; + margin: 0 auto; + + .menu { + position: relative; + + .menu-list { + position: absolute; + top: 50px; + width: 100%; + left: 0; + + .menu-item { + position: relative; + margin-bottom: 40px; + width: 150px; + height: 70px; + line-height: 70px; + color: rgba(#fff, 0.6); + font-size: 20px; + border-radius: 60px; + text-align: center; + transition: all 0.2s ease; + cursor: pointer; + + &.z-zuo { + left: 60px; + background: linear-gradient(to left, rgba(rgb(67, 67, 210), 0.3), rgba(#00a, 0)); + box-shadow: -4px 4px 6px 0 inset rgba(#fff, 0.2); + &:nth-child(2), + &:nth-child(6) { + margin-left: 20px; + } + &:nth-child(3), + &:nth-child(5) { + margin-left: 20px * 2; + } + &:nth-child(4) { + margin-left: 20px * 2 + 1px; + } + } + + &.z-you { + left: 70px; + background: linear-gradient(to right, rgba(rgb(67, 67, 210), 0.3), rgba(#00a, 0)); + box-shadow: 4px 4px 6px 0 inset rgba(#fff, 0.2); + + &:nth-child(2), + &:nth-child(6) { + margin-left: -20px; + } + &:nth-child(3), + &:nth-child(5) { + margin-left: -20px * 2; + } + &:nth-child(4) { + margin-left: -20px * 2 - 1px; + } + } + + &:hover, + &.z-on { + transform: scale(1.15); + color: rgba(#fff, 0.95); + } + } + } + } + + .arrow { + width: 60px; + margin: 0 20px; + } + + .item { + position: relative; + margin: 0 50px; + width: 420px; + + .item-wrap { + text-align: center; + cursor: pointer; + transition: all 0.2s ease; + &:hover { + transform: scale(1.1); + } + } + + &.z-on { + .name { + color: #ffffff; + background-color: transparent; + border-color: #ffffff; + &::before { + background-color: #ffffff; + } + } + } + .logo { + width: 100%; + } + .name { + position: absolute; + top: 12%; + left: 0; + width: 100%; + font-size: 36px; + line-height: 40px; + color: #fff; + } + } + } +} + +.m-footer { + position: absolute; + bottom: 0; + left: 0; + right: 0; + padding: 20px; + color: rgba(255, 255, 255, 0.6); + text-align: center; + p { + margin: 10px 0; + } + a { + padding: 0 5px; + color: rgba(255, 255, 255, 0.6); + &:focus, + &:hover { + color: #fff; + } + } +} diff --git a/src/assets/scss/pages/yantai-login.scss b/src/assets/scss/pages/yantai-login.scss new file mode 100644 index 000000000..189e3f2b4 --- /dev/null +++ b/src/assets/scss/pages/yantai-login.scss @@ -0,0 +1,210 @@ +@import "~@/assets/scss/c/config.scss"; +@import "~@/assets/scss/c/function.scss"; + +.g-bd { + &::before, + &::after { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: -1; + content: ""; + } + &::before { + background-image: url(~@/assets/img/yantai/login/bg.png); + background-size: cover; + } + &::after { + // background-color: rgba(38, 50, 56, 0.1); + } +} + +.m-snow-box { + position: absolute; + top: 20vh; + width: 35vw; + height: 50vh; + left: 13vw; + border-radius: 40%; + // overflow: hidden; +} + +.m-fm { + position: absolute; + top: 0; + bottom: 0; + right: 13%; + margin: auto; + width: 484px; + height: 429px; + background: rgba(#fff, 1); + box-shadow: 0px 0px 20px 2px rgba(150, 150, 200, 0.6); + border-radius: 12px 12px 12px 12px; + + &:hover { + opacity: 1; + background: rgba(#fff, 1); + } + + .wrap { + padding-top: 5px; + + .title { + margin: 0 auto; + width: 400px; + line-height: 80px; + border-bottom: 1px solid #d4d4d4; + font-size: 34px; + font-family: PingFang SC; + font-weight: bold; + color: #000000; + text-align: center; + } + .fm { + padding: 15px 30px; + + .fm-item { + box-sizing: border-box; + margin: 0 auto; + margin-top: 16px; + width: 400px; + height: 46px; + line-height: 46px; + border: 1px solid #c6c6c6; + border-radius: 4px; + display: flex; + align-items: center; + + .input { + width: 85%; + + input { + display: block; + padding-left: 15px; + line-height: 44px; + height: 44px; + width: 100%; + border: none; + } + } + + .ico { + position: relative; + width: 35px; + height: 46px; + + img { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + } + } + } + + .fm-captcha { + box-sizing: border-box; + margin: 0 auto; + margin-top: 16px; + width: 400px; + display: flex; + align-items: center; + + .fm-item { + margin: 0; + width: 200px; + } + + .captcha { + position: relative; + margin-left: auto; + width: 180px; + height: 46px; + + img { + display: block; + width: 100%; + height: 100%; + background-color: #eee; + border: none; + } + } + } + + .fm-btn { + box-sizing: border-box; + margin: 0 auto; + margin-top: 40px; + width: 400px; + height: 56px; + line-height: 56px; + background: linear-gradient(90deg, #1a5afd, #26c4ff); + border-radius: 4px; + font-size: 23px; + font-family: PingFang SC; + font-weight: 500; + color: #ffffff; + text-align: center; + cursor: pointer; + } + } + .hint { + display: none; + padding-left: 40px; + color: rgb(255, 80, 80); + } + } +} + +.m-footer { + position: absolute; + bottom: 0; + left: 0; + right: 0; + padding: 20px; + color: rgba(255, 255, 255, 0.6); + text-align: center; + p { + margin: 10px 0; + } + a { + padding: 0 5px; + color: rgba(255, 255, 255, 0.6); + &:focus, + &:hover { + color: #fff; + } + } +} + +.m-pop { + height: auto; + + .div_row { + height: 50px; + text-align: center; + line-height: 50px; + + &:hover { + color: rgb(2, 119, 173); + font-weight: bold; + text-decoration: underline; + } + + .i_icon { + width: 15px; + height: 15px; + margin-right: 10px; + float: left; + } + .span_name { + font-size: 18px; + cursor: pointer; + /* color: rgb(37, 156, 235); */ + } + } +} diff --git a/src/element-ui/theme-variables.scss b/src/element-ui/theme-variables.scss index 9a9bacf46..93d161a54 100644 --- a/src/element-ui/theme-variables.scss +++ b/src/element-ui/theme-variables.scss @@ -16,7 +16,8 @@ $--color-transition-base: color .2s cubic-bezier(.645,.045,.355,1) !default; /* Color -------------------------- */ /// color|1|Brand Color|0 -$--color-primary: #17B3A3 !default; +// $--color-primary: #17B3A3 !default; +$--color-primary: #3E8EF7 !default; /// color|1|Background Color|4 $--color-white: #FFFFFF !default; /// color|1|Background Color|4 diff --git a/src/router/index.js b/src/router/index.js index ad6160919..b282065ea 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -6,6 +6,7 @@ import store from "@/js/store"; Vue.use(Router); +const CUSTOMER = process.env.VUE_APP_CUSTOMER; // 页面路由(独立页面) export const pageRoutes = [ { @@ -26,7 +27,11 @@ export const pageRoutes = [ }, { path: "/login", - component: () => import("@/views/pages/login"), + component: () => { + return CUSTOMER == "yantai" + ? import("@/views/pages/yantai-login") + : import("@/views/pages/login"); + }, name: "login", meta: { title: "登录", @@ -35,7 +40,11 @@ export const pageRoutes = [ { path: "/", name: "index", - component: () => import("@/views/pages/index"), + component: () => { + return CUSTOMER == "yantai" + ? import("@/views/pages/yantai-index") + : import("@/views/pages/index"); + }, }, { path: "/indexWork", diff --git a/src/views/components/fixed1920.vue b/src/views/components/fixed1920.vue new file mode 100644 index 000000000..91393b0b3 --- /dev/null +++ b/src/views/components/fixed1920.vue @@ -0,0 +1,61 @@ + + + + diff --git a/src/views/main-shuju/main.vue b/src/views/main-shuju/main.vue index 4abb6808f..37581b4a4 100644 --- a/src/views/main-shuju/main.vue +++ b/src/views/main-shuju/main.vue @@ -29,6 +29,7 @@ import debounce from "lodash/debounce"; import { mapGetters } from "vuex"; import nextTick from "dai-js/tools/nextTick"; import { requestPost } from "@/js/dai/request"; +import fixed1920 from "@/views/components/fixed1920.vue"; export default { provide() { @@ -51,6 +52,7 @@ export default { components: { MainNavbar, MainContent, + fixed1920, }, watch: { @@ -145,7 +147,8 @@ export default { &::-webkit-scrollbar-corner, /* 滚动条角落 */ &::-webkit-scrollbar-thumb, - &::-webkit-scrollbar-track { /*滚动条的轨道*/ + &::-webkit-scrollbar-track { + /*滚动条的轨道*/ border-radius: 4px; } @@ -153,13 +156,13 @@ export default { &::-webkit-scrollbar-track { /* 滚动条轨道 */ - background: rgba(12, 129, 254, .24); + background: rgba(12, 129, 254, 0.24); // box-shadow: inset 0 0 1px rgba(180, 160, 120, 0.5); } &::-webkit-scrollbar-thumb { /* 滚动条手柄 */ - background: linear-gradient(270deg, #1257c9, #0095FF); + background: linear-gradient(270deg, #1257c9, #0095ff); } } diff --git a/src/views/pages/yantai-index.vue b/src/views/pages/yantai-index.vue new file mode 100644 index 000000000..3646c8c93 --- /dev/null +++ b/src/views/pages/yantai-index.vue @@ -0,0 +1,209 @@ + + + + diff --git a/src/views/pages/yantai-login.vue b/src/views/pages/yantai-login.vue new file mode 100644 index 000000000..d4982e55e --- /dev/null +++ b/src/views/pages/yantai-login.vue @@ -0,0 +1,435 @@ + + + + +