Browse Source

兽医PC端页面修改

master
王妍洁 1 month ago
parent
commit
c846661904
  1. 2
      chenhai-ui/public/index.html
  2. BIN
      chenhai-ui/public/sy.png
  3. 59
      chenhai-ui/src/api/login.js
  4. 8
      chenhai-ui/src/api/vet/info.js
  5. 12
      chenhai-ui/src/assets/styles/ruoyi.scss
  6. 8
      chenhai-ui/src/assets/styles/sidebar.scss
  7. 33
      chenhai-ui/src/assets/styles/variables.scss
  8. 2
      chenhai-ui/src/layout/components/Settings/index.vue
  9. 7
      chenhai-ui/src/layout/components/Sidebar/Logo.vue
  10. 6
      chenhai-ui/src/layout/components/TagsView/index.vue
  11. 6
      chenhai-ui/src/permission.js
  12. 26
      chenhai-ui/src/router/index.js
  13. 26
      chenhai-ui/src/store/modules/user.js
  14. 2152
      chenhai-ui/src/views/index.vue
  15. 1173
      chenhai-ui/src/views/indexGld.vue
  16. 874
      chenhai-ui/src/views/login.vue
  17. 584
      chenhai-ui/src/views/loginGld.vue
  18. 60
      chenhai-ui/src/views/muhu/ads/index.vue
  19. 77
      chenhai-ui/src/views/muhu/warning/index.vue
  20. 118
      chenhai-ui/src/views/vet/certificate/index.vue
  21. 156
      chenhai-ui/src/views/vet/info/index.vue
  22. 48
      chenhai-ui/src/views/vet/notification/index.vue

2
chenhai-ui/public/index.html

@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="icon" href="<%= BASE_URL %>sy.png">
<title><%= webpackConfig.name %></title>
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
<style>

BIN
chenhai-ui/public/sy.png

After

Width: 200  |  Height: 200  |  Size: 8.9 KiB

59
chenhai-ui/src/api/login.js

@ -1,12 +1,13 @@
import request from '@/utils/request'
// 登录方法
export function login(username, password, code, uuid) {
// 管理员登录
export function loginGld(username, password) {
const data = {
username,
password,
code,
uuid
// code,
// uuid
}
return request({
url: '/login',
@ -19,6 +20,38 @@ export function login(username, password, code, uuid) {
})
}
// 兽医登录
export function login(phone, password) {
const data = {
phone,
password,
// code,
// uuid
}
return request({
url: '/auth/phone/login',
headers: {
isToken: false,
repeatSubmit: false
},
method: 'post',
data: data
})
}
// 兽医注册
export function registersy(data) {
return request({
url: '/auth/vet/register',
headers: {
isToken: false,
repeatSubmit: false
},
method: 'post',
data: data
})
}
// 注册方法
export function register(data) {
return request({
@ -48,13 +81,13 @@ export function logout() {
}
// 获取验证码
export function getCodeImg() {
return request({
url: '/captchaImage',
headers: {
isToken: false
},
method: 'get',
timeout: 20000
})
}
// export function getCodeImg() {
// return request({
// url: '/captchaImage',
// headers: {
// isToken: false
// },
// method: 'get',
// timeout: 20000
// })
// }

8
chenhai-ui/src/api/vet/info.js

@ -17,6 +17,14 @@ export function getInfo(id) {
})
}
// 兽医个人信息详情
export function getfull(id) {
return request({
url: '/vet/info/full/' + id,
method: 'get'
})
}
// 新增兽医个人信息
export function addInfo(data) {
return request({

12
chenhai-ui/src/assets/styles/ruoyi.scss

@ -89,16 +89,26 @@
}
.el-table {
border: 1px solid #dfe4ed;
border-radius: 8px;
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #f8f8f9;
background-color: #d9f0eb;
color: #515a6e;
height: 40px;
font-size: 13px;
}
}
.el-table__row {
td{
border-left: 1px solid #dfe4ed;
border-right: 1px solid #dfe4ed;
text-align: center;
}
}
.el-table__body-wrapper {
.el-button [class*="el-icon-"] + span {
margin-left: 1px;

8
chenhai-ui/src/assets/styles/sidebar.scss

@ -76,6 +76,14 @@
white-space: nowrap !important;
}
.el-menu-item.is-active {
color: #409EFF !important;
background-color: $base-sub-menu-hover !important; // 点击菜单的颜色
&:hover {
background-color: $base-sub-menu-hover !important;
}
}
// menu hover
.submenu-title-noDropdown,
.el-submenu__title {

33
chenhai-ui/src/assets/styles/variables.scss

@ -9,17 +9,32 @@ $yellow:#FEC171;
$panGreen: #30B08F;
// 默认菜单主题风格
$base-menu-color:#bfcbd9;
$base-menu-color-active:#f4f4f5;
$base-menu-background:#304156;
$base-logo-title-color: #ffffff;
//$base-menu-color:#bfcbd9;
//$base-menu-color-active:#f4f4f5;
//$base-menu-background:#304156;
//$base-logo-title-color: #ffffff;
//
//$base-menu-light-color:rgba(0,0,0,.70);
//$base-menu-light-background:#ffffff;
//$base-logo-light-title-color: #001529;
//
//$base-sub-menu-background:#1f2d3d;
//$base-sub-menu-hover:#001528;
$base-menu-light-color:rgba(0,0,0,.70);
$base-menu-light-background:#ffffff;
$base-logo-light-title-color: #001529;
$base-sub-menu-background:#1f2d3d;
$base-sub-menu-hover:#001528;
// 自定义亮色菜单风格
$base-menu-color: #6CAB86;
$base-menu-color-active: #084a0e;
$base-menu-background: #ECF8F7;
$base-logo-title-color: #427a47;
$base-menu-light-color: rgb(198, 253, 253);
$base-menu-light-background: #ECF8F7;
$base-logo-light-title-color: #427a47;
$base-sub-menu-background: #EFF5FB;
$base-sub-menu-hover: #CBF2EE;
// 自定义暗色菜单风格
/**

2
chenhai-ui/src/layout/components/Settings/index.vue

@ -292,7 +292,7 @@ export default {
height: 100%;
padding-top: 15px;
padding-left: 24px;
color: #1890ff;
color: #42B983;
font-weight: 700;
font-size: 14px;
}

7
chenhai-ui/src/layout/components/Sidebar/Logo.vue

@ -3,7 +3,7 @@
<transition name="sidebarLogoFade">
<router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' && navType !== 3 ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
<h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' && navType !== 3 ? variables.logoTitleColor : variables.logoLightTitleColor }">111 </h1>
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo" />
@ -14,7 +14,7 @@
</template>
<script>
import logoImg from '@/assets/logo/logo.png'
import logoImg from '@/assets/logo/shouyi.png'
import variables from '@/assets/styles/variables.scss'
export default {
@ -59,7 +59,8 @@ export default {
position: relative;
height: 50px;
line-height: 50px;
background: #2b2f3a;
//background: #2b2f3a;
background: #ECF8F7 !important;
text-align: center;
overflow: hidden;

6
chenhai-ui/src/layout/components/TagsView/index.vue

@ -265,9 +265,9 @@ export default {
margin-right: 15px;
}
&.active {
background-color: #42b983;
color: #fff;
border-color: #42b983;
background-color: #42b983 !important;
order-color: #42b983 !important;
color:#fff;
&::before {
content: '';
background: #fff;

6
chenhai-ui/src/permission.js

@ -9,7 +9,7 @@ import { isRelogin } from '@/utils/request'
NProgress.configure({ showSpinner: false })
const whiteList = ['/login', '/register']
const whiteList = ['/login', '/loginGld', '/register']
const isWhiteList = (path) => {
return whiteList.some(pattern => isPathMatch(pattern, path))
@ -23,6 +23,10 @@ router.beforeEach((to, from, next) => {
if (to.path === '/login') {
next({ path: '/' })
NProgress.done()
}
else if (to.path === '/loginGld') {
next({ path: '/indexGld' })
NProgress.done()
} else if (isWhiteList(to.path)) {
next()
} else {

26
chenhai-ui/src/router/index.js

@ -41,11 +41,19 @@ export const constantRoutes = [
}
]
},
// 管理员登录
{
path: '/loginGld',
component: () => import('@/views/loginGld'),
hidden: true
},
// 兽医端登录
{
path: '/login',
component: () => import('@/views/login'),
hidden: true
},
{
path: '/register',
component: () => import('@/views/register'),
@ -61,6 +69,21 @@ export const constantRoutes = [
component: () => import('@/views/error/401'),
hidden: true
},
// 管理员首页
{
path: '/',
component: Layout,
redirect: 'indexGld',
children: [
{
path: 'indexGld',
component: () => import('@/views/indexGld'),
name: 'IndexGld',
meta: { title: '管理员首页', icon: 'dashboard', affix: true }
}
]
},
// 兽医首页
{
path: '',
component: Layout,
@ -70,10 +93,11 @@ export const constantRoutes = [
path: 'index',
component: () => import('@/views/index'),
name: 'Index',
meta: { title: '首页', icon: 'dashboard', affix: true }
meta: { title: '兽医首页', icon: 'dashboard', affix: true }
}
]
},
{
path: '/user',
component: Layout,

26
chenhai-ui/src/store/modules/user.js

@ -1,6 +1,6 @@
import router from '@/router'
import { MessageBox, } from 'element-ui'
import { login, logout, getInfo } from '@/api/login'
import { loginGld, login, logout, getInfo } from '@/api/login'
import { getToken, setToken, removeToken } from '@/utils/auth'
import { isHttp, isEmpty } from "@/utils/validate"
import defAva from '@/assets/images/profile.jpg'
@ -42,13 +42,29 @@ const user = {
actions: {
// 登录
Login({ commit }, userInfo) {
// 管理端登录
LoginGld({ commit }, userInfo) {
const username = userInfo.username.trim()
const password = userInfo.password
const code = userInfo.code
const uuid = userInfo.uuid
// const code = userInfo.code
// const uuid = userInfo.uuid
return new Promise((resolve, reject) => {
loginGld(username, password).then(res => {
setToken(res.token)
commit('SET_TOKEN', res.token)
resolve()
}).catch(error => {
reject(error)
})
})
},
// 兽医登录
Login({ commit }, userInfo) {
const phone = userInfo.phone.trim()
const password = userInfo.password
return new Promise((resolve, reject) => {
login(username, password, code, uuid).then(res => {
login(phone, password).then(res => {
setToken(res.token)
commit('SET_TOKEN', res.token)
resolve()

2152
chenhai-ui/src/views/index.vue
File diff suppressed because it is too large
View File

1173
chenhai-ui/src/views/indexGld.vue
File diff suppressed because it is too large
View File

874
chenhai-ui/src/views/login.vue

@ -1,100 +1,259 @@
<template>
<div class="login">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
<h3 class="title">{{title}}</h3>
<el-form-item prop="username">
<el-input
v-model="loginForm.username"
type="text"
auto-complete="off"
placeholder="账号"
>
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginForm.password"
type="password"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="code" v-if="captchaEnabled">
<el-input
v-model="loginForm.code"
auto-complete="off"
placeholder="验证码"
style="width: 63%"
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
<div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
<!-- 登录模块 -->
<div class="login-form">
<!-- 左侧登录部分 -->
<div class="login-left">
<div class="left-content">
<div>
<svg t="1767064507714" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4145" width="100" height="100"><path d="M446.464 684.544c-24.576 0-44.544-19.968-44.544-44.544V445.952c0-24.576 19.968-44.544 44.544-44.544 24.576 0 44.544 19.968 44.544 44.544V640c0 24.576-19.968 44.544-44.544 44.544z" p-id="4146" fill="#95DBD4"></path><path d="M305.152 543.232c0-24.576 19.968-44.544 44.544-44.544h194.048c24.576 0 44.544 19.968 44.544 44.544 0 24.576-19.968 44.544-44.544 44.544H349.696c-24.576 0.512-44.544-19.456-44.544-44.544z" p-id="4147" fill="#95DBD4"></path><path d="M1012.736 748.032v-1.536c-2.048-20.48-7.168-40.448-14.848-58.368-10.752-28.16-27.648-52.224-49.664-70.656-11.776-9.728-24.576-17.92-38.912-24.064-14.336-6.656-29.696-10.752-45.568-13.312-3.584-0.512-7.68-1.024-11.264-1.536-2.048 0-3.584-0.512-5.632-0.512-5.632-0.512-11.264-1.024-17.408-1.024-10.24 0-20.48 1.024-30.208 2.56-26.624 4.096-51.712 13.824-73.216 27.648-12.288 7.168-24.064 15.36-35.328 24.576-13.312 11.264-26.624 23.04-39.424 34.816-13.312 12.288-26.624 25.088-40.448 37.376-2.56 2.56-5.12 4.608-8.192 7.168-21.504 18.944-43.52 33.792-67.072 44.544-23.04 10.752-47.616 17.408-73.216 19.968-4.608 0.512-9.216 1.024-13.824 1.024-17.92 0.512-36.352-1.024-55.296-5.12-19.968-4.096-37.888-9.728-54.784-17.408-1.536-1.024-3.584-1.536-5.12-2.56-37.888-19.968-69.632-50.176-91.136-87.04-7.68-13.312-13.824-28.16-18.944-43.52-4.096-12.8-7.168-25.6-9.216-37.888-0.512-3.072-1.024-6.656-1.536-9.728-0.512-6.656-1.024-13.312-1.024-19.968 0-22.528 3.072-44.032 9.216-64.512 3.072-9.728 6.656-18.944 11.264-28.16 8.704-18.944 20.48-36.864 34.304-53.76 31.232-35.84 73.216-61.44 121.344-71.68 6.656-1.536 13.824-2.56 20.48-3.072 1.536 0 3.072-0.512 4.608-0.512 1.536 0 3.072-0.512 4.608-0.512 5.632-0.512 11.776-1.024 17.92-1.024 9.728 0 18.944 0.512 28.16 1.536 51.712 6.656 97.792 30.72 132.096 66.048 10.752 11.264 19.968 24.064 28.16 37.888 1.536 2.048 2.56 4.608 3.584 6.656 1.024 2.56 2.56 4.096 3.584 5.632l3.072 3.072c2.56 2.048 5.632 2.56 9.216 2.048 1.024 0 1.536-0.512 2.56-1.024 2.56-1.024 5.632-3.584 8.704-6.656 6.656-8.192 12.288-15.36 17.92-23.04 3.584-5.12 7.68-9.728 10.752-14.848 55.296-75.264 87.552-168.448 87.552-268.8 0-28.672-2.56-56.32-7.68-83.456-1.536-7.168-8.704-11.264-15.36-8.704-2.048 1.024-4.096 1.536-6.144 2.048-1.024 0.512-1.536 0.512-2.56 1.024-47.616 17.408-91.648 43.008-130.56 74.24-3.584 3.072-7.68 6.144-10.752 9.216-2.56 2.56-5.632 4.608-8.192 7.168-3.584 2.56-7.68 4.096-11.264 5.12-2.048 0.512-4.096 0.512-6.656 0.512-2.048 0-4.096 0-6.656-0.512-1.536-0.512-2.56-1.024-4.096-1.536h-0.512c-0.512 0-1.024-0.512-1.536-0.512-5.12-1.536-10.752-3.072-15.872-4.608-34.304-8.704-70.144-13.312-107.008-13.312-36.352 0-71.68 4.608-105.472 13.312-5.632 1.536-10.752 3.072-15.872 4.608-2.048-1.024-4.608 0-7.168 1.024-1.536 0-3.584 0.512-5.12 0.512-1.536 0-3.072 0-4.608-0.512-5.12-1.024-9.216-2.56-13.312-5.12l-0.512-0.512c-2.048-1.536-4.096-3.584-6.144-5.632-4.096-3.584-8.192-7.168-12.8-10.752-29.696-24.064-62.464-44.544-97.792-60.928-0.512-0.512-1.536-0.512-2.048-1.024-0.512 0-1.024-0.512-1.024-0.512-10.752-5.12-21.504-9.216-32.768-13.312-3.072-1.024-5.632-2.048-8.704-3.072-6.656-2.56-13.824 2.048-15.36 9.216-0.512 2.048-1.024 4.608-1.024 6.656 0 1.024-0.512 1.536-0.512 2.56-4.096 24.576-6.144 49.664-6.144 75.264 0 28.672 2.56 56.32 7.68 83.456 1.024 6.144 1.536 12.288 2.56 18.432 0.512 4.608 1.024 9.216 2.048 13.312 0.512 2.048 0.512 4.096 0.512 6.144 0.512 7.68-1.536 14.336-4.608 20.992C66.048 329.728 35.84 389.632 20.48 455.68c-2.048 8.704-3.584 17.408-5.12 26.112-3.072 18.944-5.12 37.888-5.632 57.344v12.288c0 136.704 64.512 258.56 164.352 336.896 72.704 56.832 164.352 90.624 263.68 90.624 90.624 0 174.592-28.16 243.2-76.288 1.024-0.512 2.048-1.536 3.072-2.048 5.632-4.096 11.264-8.192 16.896-12.8 16.384-13.312 32.256-27.136 47.104-43.008 6.656-6.656 13.824-13.312 20.48-19.968 1.536-1.536 3.072-3.072 4.608-4.096 5.12-5.12 9.728-9.728 14.848-14.336l19.968-18.432c16.384-14.848 33.28-26.624 51.2-34.816 24.064-10.752 50.176-16.384 78.336-16.384 25.6 0 49.664 5.12 71.68 13.824h1.024c1.024 0 1.536-0.512 2.56-1.024-0.512 0 0-0.512 0-1.536z" p-id="4148" fill="#95DBD4"></path></svg>
</div>
<div class="welcome-text">Welcome to log in</div>
<hr class="divider">
<h3 class="title">"与牧同行"兽医端</h3>
<div class="slogan">
<div class="icon-info">
<svg t="1767603518204" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13872" width="20" height="20"><path d="M191.90624 190.952007l641.318274 0 0 448.933639L191.90624 639.885646 191.90624 190.952007 191.90624 190.952007zM868.691283 61.809741 156.493705 61.809741c-50.994418 0-92.339058 41.434691-92.339058 92.553952l0 520.745175c0 51.116191 41.336454 92.553952 92.339058 92.553952l223.89428 0 0 127.747499L222.537887 895.41032c-17.569144 0-31.81152 14.246469-31.81152 31.807427 0 17.569144 14.242376 31.815613 31.81152 31.815613L800.750915 959.033359c17.569144 0 31.815613-14.246469 31.815613-31.815613 0-17.560958-14.246469-31.807427-31.815613-31.807427L641.028167 895.41032 641.028167 767.663844l227.66414 0c50.998511 0 92.342128-41.437761 92.342128-92.553952L961.034435 154.363693C961.033411 103.252619 919.689794 61.809741 868.691283 61.809741L868.691283 61.809741zM898.61071 704.558597 127.961882 704.558597 127.961882 127.477346l770.647805 0L898.609687 704.558597 898.61071 704.558597zM898.61071 704.558597" fill="#CDCDCD" p-id="13873"></path></svg><path d="M384 768v42.666667h-42.325333C318.08 810.666667 298.666667 830.08 298.666667 853.674667c0 22.912 18.773333 42.325333 42.325333 42.325333h341.973333A42.666667 42.666667 0 0 0 725.333333 852.992 43.093333 43.093333 0 0 0 682.325333 810.666667H640v-42.666667h213.333333a85.333333 85.333333 0 0 0 85.333334-85.333333V213.333333a85.333333 85.333333 0 0 0-85.333334-85.333333H170.666667a85.333333 85.333333 0 0 0-85.333334 85.333333v469.333334a85.333333 85.333333 0 0 0 85.333334 85.333333h213.333333z m469.333333-85.333333H170.666667V213.333333h682.666666v469.333334z" p-id="12221" fill="#CDCDCD"></path></svg><path d="M191.90624 190.952007l641.318274 0 0 448.933639L191.90624 639.885646 191.90624 190.952007 191.90624 190.952007zM868.691283 61.809741 156.493705 61.809741c-50.994418 0-92.339058 41.434691-92.339058 92.553952l0 520.745175c0 51.116191 41.336454 92.553952 92.339058 92.553952l223.89428 0 0 127.747499L222.537887 895.41032c-17.569144 0-31.81152 14.246469-31.81152 31.807427 0 17.569144 14.242376 31.815613 31.81152 31.815613L800.750915 959.033359c17.569144 0 31.815613-14.246469 31.815613-31.815613 0-17.560958-14.246469-31.807427-31.815613-31.807427L641.028167 895.41032 641.028167 767.663844l227.66414 0c50.998511 0 92.342128-41.437761 92.342128-92.553952L961.034435 154.363693C961.033411 103.252619 919.689794 61.809741 868.691283 61.809741L868.691283 61.809741zM898.61071 704.558597 127.961882 704.558597 127.961882 127.477346l770.647805 0L898.609687 704.558597 898.61071 704.558597zM898.61071 704.558597" fill="#CDCDCD" p-id="7961"></path></svg>
<div class="icon-text">一站通登筑牢账号防线</div>
</div>
<div class="icon-info">
<svg t="1766995101015" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3669" width="20" height="20"><path d="M873.767394 852.441693" fill="#cdcdcd" p-id="3670"></path><path d="M510.567371 64.413032c-247.00565 0-447.24416 200.236464-447.24416 447.24416S263.560698 958.902376 510.567371 958.902376c94.481861 0 182.116781-29.296233 254.322289-79.300091-0.151449-0.054235-0.293689-0.11768-0.445138-0.171915 7.319709-5.901407 12.010545-14.936177 12.010545-25.069979 0-17.774829-14.404058-32.178887-32.17991-32.178887-9.717316 0-18.424628 4.314259-24.327058 11.124362-0.01535-0.054235-0.038886-0.102331-0.054235-0.156566-60.0824 39.025828-131.771139 61.701271-208.753441 61.701271-211.946157 0-383.761314-171.817204-383.761314-383.76643 0-211.94411 171.816181-383.761314 383.761314-383.761314 211.94411 0 383.760291 171.817204 383.760291 383.761314 0 87.044472-28.984125 167.316703-77.819366 231.699036-6.610558 5.892197-10.778484 14.473643-10.778484 24.02416 0 17.770735 14.404058 32.17991 32.17991 32.17991 8.271384 0 15.815197-3.127224 21.518083-8.258081 0.005117 0.024559 0.01535 0.044002 0.01842 0.068562 0.083911-0.102331 0.161682-0.204661 0.245593-0.308015 2.62785-2.424212 4.856611-5.27719 6.566556-8.452509 57.082066-75.097372 90.982154-168.775938 90.982154-270.381034C957.812555 264.649496 757.574045 64.413032 510.567371 64.413032z" fill="#cdcdcd" p-id="3671"></path><path d="M284.899702 638.201284 490.980267 762.180969 490.980267 519.241938 284.899702 395.258159Z" fill="#cdcdcd" p-id="3672"></path><path d="M504.383532 260.072247 310.031079 360.600825 511.162936 487.178685 712.290699 383.848295Z" fill="#cdcdcd" p-id="3673"></path><path d="M533.799492 518.124488 533.799492 761.063519 735.00298 657.734152 735.007073 657.734152 735.007073 414.795121Z" fill="#cdcdcd" p-id="3674"></path></svg>
<div class="icon-text">资源聚合资讯产品赋能</div>
</div>
<div class="icon-info">
<svg t="1766995362770" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10345" width="20" height="20"><path d="M730.453 749.277c-16.711 0-30.838 11.286-35.098 26.578H430.881c-27.197 0-55.924 15.984-70.997 38.703l-39.14 37.137-0.073-14.309a36.955 36.955 0 0 0-4.187-16.784c-13.69-25.887-45.038-44.71-74.638-44.71H184.32V366.364h12.124a36.409 36.409 0 1 0 0-72.817h-24.248c-33.46 0-60.694 28.29-60.694 63.06v429.079c0 34.77 27.307 62.987 60.84 62.987h69.468a16.093 16.093 0 0 1 6.116 2.44l0.328 52.173a36.336 36.336 0 0 0 7.537 21.991c11.541 15.037 28.435 23.666 46.312 23.63h0.036c16.785 0 32.732-7.646 44.164-21.008l67.247-63.934c2.221-2.112 5.425-6.627 7.027-9.248a18.168 18.168 0 0 1 10.304-6.008h275.324a60.439 60.439 0 0 0 53.812-33.933 36.045 36.045 0 0 0 6.845-21.262v-7.828a36.409 36.409 0 0 0-36.409-36.41" p-id="10346" fill="#cdcdcd"></path><path d="M876.089 557.438h-57.526c-18.241 0-36.664 7.683-51.7 19.224-3.46 2.658-7.1 5.061-10.122 8.156a78.206 78.206 0 0 0-12.816 17.33 36.7 36.7 0 0 0-4.187 16.748l-0.073 14.382-39.14-37.173c-2.73-4.115-6.299-7.683-9.83-11.287-15.984-16.384-38.885-27.38-61.167-27.38H366.364V147.911H876.09v409.527z m66.956-445.936c-9.721-21.445-30.547-36.409-54.832-36.409H354.24c-24.284 0-45.11 14.964-54.832 36.41a64.808 64.808 0 0 0-5.861 26.614v429.115c0 6.153 1.128 11.979 2.694 17.586 7.39 26.178 30.438 45.438 57.963 45.438H629.49a18.168 18.168 0 0 1 10.268 5.898 35.717 35.717 0 0 0 7.1 9.357l67.247 63.934c11.432 13.399 27.38 21.008 44.164 21.008h0.036c17.877 0 34.77-8.592 46.312-23.629a36.336 36.336 0 0 0 7.537-21.991l0.328-52.21a15.437 15.437 0 0 1 6.08-2.367h69.504c27.598 0 50.718-19.26 58.109-45.438 1.602-5.607 2.73-11.433 2.73-17.586V138.117a64.808 64.808 0 0 0-5.861-26.615z" p-id="10347" fill="#cdcdcd"></path><path d="M530.204 293.547a54.613 54.613 0 1 0 0.037 109.263 54.613 54.613 0 0 0-0.037-109.227m182.045-0.036a54.613 54.613 0 1 0 0.036 109.263 54.613 54.613 0 0 0-0.036-109.227" p-id="10348" fill="#cdcdcd"></path></svg>
<div class="icon-text">用户生态互动管理共生</div>
</div>
</div>
</div>
</el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
<el-form-item style="width:100%;">
<el-button
:loading="loading"
size="medium"
type="primary"
style="width:100%;"
@click.native.prevent="handleLogin"
>
<span v-if="!loading"> </span>
<span v-else> 中...</span>
</el-button>
<div style="float: right;" v-if="register">
<router-link class="link-type" :to="'/register'">立即注册</router-link>
</div>
<!-- 注册弹窗 -->
<el-dialog :title="欢迎注册" :visible.sync="open" width="500px" append-to-body class="register-dialog">
<el-form ref="registerForm" :model="registerForm" :rules="registerRules">
<el-form-item prop="phone">
<el-input
v-model="registerForm.phone"
type="text"
auto-complete="off"
placeholder="手机号"
maxlength="11"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="registerForm.password"
:type="registerPwdVisible ? 'text' : 'password'"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleRegister"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
<template slot="suffix">
<svg-icon
:icon-class="registerPwdVisible ? 'eye-open' : 'eye'"
class="el-input__icon eye-icon"
@click="registerPwdVisible = !registerPwdVisible"
/>
</template>
</el-input>
</el-form-item>
<el-form-item prop="confirmPassword">
<el-input
v-model="registerForm.confirmPassword"
:type="confirmPwdVisible ? 'text' : 'password'"
auto-complete="off"
placeholder="确认密码"
@keyup.enter.native="handleRegister"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
<template slot="suffix">
<svg-icon
:icon-class="confirmPwdVisible ? 'eye-open' : 'eye'"
class="el-input__icon eye-icon"
@click="confirmPwdVisible = !confirmPwdVisible"
/>
</template>
</el-input>
</el-form-item>
<el-form-item style="width:100%;">
<el-button
:registerloading="registerloading"
size="medium"
type="primary"
class = "register-btn"
@click.native.prevent="handleRegister"
>
<span v-if="!registerloading"> </span>
<span v-else> 中...</span>
</el-button>
<div class="sponsored-info">
<span >© 2025-2026 内蒙古琛海科技有限公司</span>
<span class="sponsored">v1.0.1</span>
</div>
</el-form-item>
</el-form>
</el-dialog>
<!-- 右侧登录部分 -->
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-right">
<div class="admin-text">欢迎登录</div>
<el-form-item prop="phone">
<el-input
v-model="loginForm.phone"
type="text"
auto-complete="off"
placeholder="手机号"
maxlength="11"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginForm.password"
:type="passwordVisible ? 'text' : 'password'"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleLogin"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
<template slot="suffix">
<svg-icon
:icon-class="passwordVisible ? 'eye-open' : 'eye'"
class="el-input__icon eye-icon"
@click="passwordVisible = !passwordVisible"
/>
</template>
</el-input>
</el-form-item>
<!-- <el-form-item prop="code" v-if="captchaEnabled" class="code-form-item">-->
<!-- <div class="code-container">-->
<!-- <el-input-->
<!-- v-model="loginForm.code"-->
<!-- auto-complete="off"-->
<!-- placeholder="验证码"-->
<!-- @keyup.enter.native="handleLogin"-->
<!-- class="custom-input code-input"-->
<!-- >-->
<!-- <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />-->
<!-- </el-input>-->
<!-- <div class="login-code">-->
<!-- <img :src="codeUrl" @click="getCode" class="login-code-img"/>-->
<!-- </div>-->
<!-- </div>-->
<!-- </el-form-item>-->
<div class="form-bottom">
<div class="form-flag">
<div>
<el-checkbox v-model="loginForm.rememberMe" class="remember-checkbox">记住密码</el-checkbox>
</div>
<div>
<el-link @click="unregistered">没有注册</el-link>
</div>
</div>
<el-form-item class="login-btn-item">
<el-button
:loginloading="loginloading"
size="medium"
type="primary"
class="login-btn"
@click.native.prevent="handleLogin"
>
<span v-if="!loginloading">登录</span>
<span v-else> 中...</span>
</el-button>
</el-form-item>
</div>
</el-form-item>
</el-form>
<!-- 底部 -->
<div class="el-login-footer">
<span>{{ footerContent }}</span>
<div class="sponsored-info">
<span >© 2025-2026 内蒙古琛海科技有限公司</span>
<span class="sponsored">v1.0.1</span>
</div>
</el-form>
</div>
</div>
</template>
<script>
import { getCodeImg } from "@/api/login"
import { login, registersy } from "@/api/login"
import Cookies from "js-cookie"
import { encrypt, decrypt } from '@/utils/jsencrypt'
import defaultSettings from '@/settings'
export default {
name: "Login",
data() {
const equalToPassword = (rule, value, callback) => {
if (this.registerForm.password !== value) {
callback(new Error("两次输入的密码不一致"))
} else {
callback()
}
}
return {
title: process.env.VUE_APP_TITLE,
footerContent: defaultSettings.footerContent,
codeUrl: "",
//
open: false,
// codeUrl: "",
passwordVisible: false,
registerPwdVisible: false,
confirmPwdVisible: false,
loginForm: {
username: "admin",
password: "admin123",
phone: "",
password: "",
rememberMe: false,
code: "",
uuid: ""
// code: "",
// uuid: ""
},
registerForm: {
phone: "",
password: "",
confirmPassword: "",
clientType: "vet-pc"
},
loginRules: {
username: [
{ required: true, trigger: "blur", message: "请输入您的账号" }
phone: [
{ required: true, trigger: "blur", message: "请输入您的电话号码" },
{ pattern: /^1[3-9]\d{9}$/, message: "请输入正确的手机号码格式", trigger: "blur" }
],
password: [
{ required: true, trigger: "blur", message: "请输入您的密码" }
]
// code: [{ required: true, trigger: "change", message: "" }]
},
registerRules: {
phone: [
{required: true, trigger: "blur", message: "请输入您的电话号码"},
{ pattern: /^1[3-9]\d{9}$/, message: "请输入正确的手机号码格式", trigger: "blur" }
],
password: [
{required: true, trigger: "blur", message: "请输入您的密码"},
{ min: 6, max: 20, message: "长度在6到20个字符", trigger: "blur" },
{ pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*()=_+;':,.?]).{8,20}$/, message: "密码必须是大写、小写字母、数字和特殊符号组成", trigger: "blur" }
],
confirmPassword: [
{required: true, trigger: "blur", message: "请再次输入您的密码"},
{required: true, validator: equalToPassword, trigger: "blur"}
],
code: [{ required: true, trigger: "change", message: "请输入验证码" }]
},
loading: false,
//
loginloading: false,
registerloading: false,
//
captchaEnabled: true,
//
register: false,
// captchaEnabled: true,
redirect: undefined
}
},
@ -107,25 +266,25 @@ export default {
}
},
created() {
this.getCode()
// this.getCode()
this.getCookie()
},
methods: {
getCode() {
getCodeImg().then(res => {
this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
if (this.captchaEnabled) {
this.codeUrl = "data:image/gif;base64," + res.img
this.loginForm.uuid = res.uuid
}
})
},
// getCode() {
// getCodeImg().then(res => {
// this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
// if (this.captchaEnabled) {
// this.codeUrl = "data:image/gif;base64," + res.img
// this.loginForm.uuid = res.uuid
// }
// })
// },
getCookie() {
const username = Cookies.get("username")
const phone = Cookies.get("phone")
const password = Cookies.get("password")
const rememberMe = Cookies.get('rememberMe')
this.loginForm = {
username: username === undefined ? this.loginForm.username : username,
phone: phone === undefined ? this.loginForm.phone : phone,
password: password === undefined ? this.loginForm.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
}
@ -133,23 +292,44 @@ export default {
handleLogin() {
this.$refs.loginForm.validate(valid => {
if (valid) {
this.loading = true
this.loginloading = true
if (this.loginForm.rememberMe) {
Cookies.set("username", this.loginForm.username, { expires: 30 })
Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 })
Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 })
Cookies.set("phone", this.loginForm.phone, {expires: 30})
Cookies.set("password", encrypt(this.loginForm.password), {expires: 30})
Cookies.set('rememberMe', this.loginForm.rememberMe, {expires: 30})
} else {
Cookies.remove("username")
Cookies.remove("phone")
Cookies.remove("password")
Cookies.remove('rememberMe')
}
this.$store.dispatch("Login", this.loginForm).then(() => {
this.$router.push({ path: this.redirect || "/" }).catch(()=>{})
this.$router.push({path: this.redirect || "/"}).catch(() => {
})
}).catch(() => {
this.loading = false
if (this.captchaEnabled) {
this.getCode()
}
this.loginloading = false
// if (this.captchaEnabled) {
// this.getCode()
// }
})
}
})
},
unregistered(row) {
this.open = true
},
handleRegister() {
this.$refs.registerForm.validate(valid => {
if (valid) {
this.registerloading = true
registersy(this.registerForm).then(res => {
this.$alert("<font color='red'>恭喜您注册成功!</font>", '系统提示', {
dangerouslyUseHTMLString: true,
type: 'success'
}).then(() => {
this.open = false;
this.registerloading = false;
this.resetRegisterForm();
}).catch(() => {})
})
}
})
@ -159,65 +339,497 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/* 登录页 */
.login {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
background-image: url("../assets/images/login-background.jpg");
background-size: cover;
height: 100vh;
width: 100vw;
background-color: #e6f7ff;
overflow: hidden;
position: relative;
}
/* 登录模块 */
.login-form {
display: flex;
width: 760px;
height: 450px;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
position: relative;
z-index: 2;
backdrop-filter: blur(5px);
background-color: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(82, 196, 26, 0.2);
}
/* 左侧登录部分 */
.login-left {
flex: 1;
background: linear-gradient(135deg, rgba(82, 196, 26, 0.9) 0%, rgba(24, 144, 255, 0.9) 100%);
display: flex;
justify-content: center;
align-items: center;
position: relative;
padding: 40px;
}
.login-left::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(255, 255, 255, 0.1);
z-index: 1;
}
.left-content {
position: relative;
z-index: 2;
text-align: center;
color: white;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.welcome-text {
font-size: 24px;
font-weight: 300;
line-height: 1.5;
color: rgba(255, 255, 255, 0.95);
}
.divider {
width: 100px;
height: 3px;
background: linear-gradient(90deg,
transparent 0%,
rgba(255, 255, 255, 0.8) 50%,
transparent 100%
);
border: none;
margin: 0 auto 30px;
}
.title {
margin: 0px auto 30px auto;
font-size: 32px;
font-weight: 600;
margin: 0 0 20px 0;
color: white;
letter-spacing: 2px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
text-align: center;
color: #707070;
}
.login-form {
border-radius: 6px;
background: #ffffff;
width: 400px;
padding: 25px 25px 5px 25px;
z-index: 1;
.el-input {
height: 38px;
input {
height: 38px;
.slogan {
.icon-info{
display: flex;
align-items: center;
justify-content: center;
margin: 10px;
transition: all 0.3s ease;
&:hover {
transform: translateY(-2px);
filter: drop-shadow(0 4px 8px rgba(255, 255, 255, 0.2));
}
svg {
transition: all 0.3s ease;
filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}
&:hover svg {
transform: scale(1.1);
filter: drop-shadow(0 4px 8px rgba(255, 255, 255, 0.3));
}
}
.input-icon {
height: 39px;
width: 14px;
margin-left: 2px;
.icon-text{
padding: 10px;
font-size: 12px;
font-weight: 500;
line-height: 1.5em;
color: rgba(255, 255, 255, 0.9);
transition: all 0.3s ease;
}
.icon-info:hover .icon-text {
color: white;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
}
.login-tip {
font-size: 13px;
/* 右侧登录部分 */
.login-right {
flex: 1;
background: rgba(255, 255, 255, 0.95);
padding: 60px 50px;
display: flex;
flex-direction: column;
justify-content: center;
}
.admin-text {
font-size: 20px;
color: #333;
text-align: center;
color: #bfbfbf;
font-weight: 600;
position: relative;
margin: 40px 0;
}
.login-code {
width: 33%;
height: 38px;
float: right;
img {
cursor: pointer;
vertical-align: middle;
.admin-text::before,
.admin-text::after {
content: '';
position: absolute;
top: 50%;
width: 70px;
height: 2px;
background: linear-gradient(90deg,
transparent 0%,
#52c41a 50%,
transparent 100%)
}
.admin-text::before {
left: 10px;
}
.admin-text::after {
right: 10px;
}
.custom-input {
::v-deep .el-input__inner {
border: 1px solid #e8e8e8;
border-radius: 6px;
background-color: rgba(250, 250, 250, 0.9);
color: #333;
padding-left: 40px;
padding-right: 40px;
transition: all 0.3s;
&:focus {
border-color: #52c41a;
background-color: white;
box-shadow: 0 0 0 2px rgba(82, 196, 26, 0.2);
}
&::placeholder {
color: #999;
}
}
}
.el-login-footer {
height: 40px;
line-height: 40px;
position: fixed;
bottom: 0;
.eye-icon {
cursor: pointer;
margin-right: 10px;
color: #999;
transition: color 0.3s;
&:hover {
color: #52c41a;
}
}
.remember-checkbox {
::v-deep .el-checkbox__inner {
border-color: #52c41a;
&:hover {
border-color: #73d13d;
}
}
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #52c41a;
border-color: #52c41a;
}
::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
color: #52c41a;
}
::v-deep .el-checkbox__label {
color: #666;
font-size: 14px;
}
}
//.code-form-item {
// .el-form-item__content {
// display: flex;
// align-items: center;
// justify-content: center;
// }
//}
//
//.code-container {
// display: flex;
// align-items: center;
// width: 100%;
// justify-content: space-between;
//}
//
//.code-input {
// flex: 1;
// margin-right: 15px;
//
// ::v-deep .el-input__inner {
// width: 100%;
// }
//}
.input-icon {
color: #999;
margin-left: 8px;
}
.form-bottom {
display: flex;
flex-direction: column;
}
.form-flag{
display: flex;
justify-content: space-between;
}
.login-btn-item {
margin-top: 20px;
margin-bottom: 0;
width: 100%;
}
.login-btn {
width: 100%;
height: 44px;
background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
border: none;
border-radius: 6px;
font-size: 16px;
font-weight: 500;
transition: all 0.3s;
color: white;
letter-spacing: 2px;
&:hover {
opacity: 0.9;
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(82, 196, 26, 0.4);
}
&:active {
transform: translateY(0);
}
}
//.login-code {
// height: 44px;
// flex-shrink: 0;
//
// .login-code-img {
// height: 44px;
// width: 120px;
// border-radius: 6px;
// cursor: pointer;
// border: 1px solid #e8e8e8;
// transition: all 0.3s;
//
// &:hover {
// transform: translateY(-1px);
// box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
// }
// }
//}
.sponsored-info{
text-align: center;
color: #fff;
font-family: Arial;
font-size: 12px;
letter-spacing: 1px;
color: #999;
border-top: 1px solid #f0f0f0;
padding-top: 15px;
.sponsored{
margin-left: 10px;
padding: 2px 6px;
background: rgba(82, 196, 26, 0.1);
border-radius: 4px;
font-family: monospace;
}
}
.el-form-item {
margin-bottom: 24px;
&.is-error {
.custom-input {
::v-deep .el-input__inner {
border-color: #f5222d;
}
}
}
}
.login-code-img {
height: 38px;
/* 注册弹窗 */
.register-dialog {
::v-deep .el-dialog {
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(82, 196, 26, 0.2);
}
::v-deep .el-dialog__header {
background: linear-gradient(135deg, rgba(82, 196, 26, 0.9) 0%, rgba(24, 144, 255, 0.9) 100%);
padding: 20px;
margin: 0;
}
::v-deep .el-dialog__title {
color: white;
font-size: 24px;
font-weight: 600;
letter-spacing: 1px;
text-align: center;
display: block;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
::v-deep .el-dialog__body {
background: rgba(255, 255, 255, 0.95);
padding: 40px;
}
::v-deep .el-form-item {
margin-bottom: 28px;
}
::v-deep .custom-input {
.el-input__inner {
border: 1px solid #e8e8e8;
border-radius: 6px;
background-color: rgba(250, 250, 250, 0.9);
color: #333;
padding-left: 40px;
padding-right: 40px;
transition: all 0.3s;
//height: 44px;
line-height: 44px;
&:focus {
border-color: #52c41a;
background-color: white;
box-shadow: 0 0 0 2px rgba(82, 196, 26, 0.2);
}
&::placeholder {
color: #999;
}
}
}
::v-deep .input-icon {
color: #999;
margin-left: 8px;
margin-right: 8px;
}
.register-btn {
width: 100%;
height: 44px;
background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
border: none;
border-radius: 6px;
font-size: 16px;
font-weight: 500;
transition: all 0.3s;
color: white;
letter-spacing: 2px;
margin-top: 10px;
&:hover {
opacity: 0.9;
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(82, 196, 26, 0.4);
}
&:active {
transform: translateY(0);
}
}
.eye-icon {
cursor: pointer;
margin-right: 10px;
color: #999;
transition: color 0.3s;
&:hover {
color: #52c41a;
}
}
}
/* 链接样式 */
.link-type {
color: #52c41a;
text-decoration: none;
font-size: 14px;
transition: all 0.3s;
&:hover {
color: #73d13d;
text-decoration: underline;
}
}
/* 响应式调整 */
@media (max-width: 992px) {
.login-form {
width: 90%;
max-width: 800px;
height: auto;
min-height: 500px;
flex-direction: column;
}
.login-left, .login-right {
flex: none;
width: 100%;
}
.login-left {
padding: 30px 20px;
min-height: 200px;
}
.login-right {
padding: 40px 30px;
}
.code-container {
flex-direction: column;
align-items: stretch;
}
.code-input {
margin-right: 0;
margin-bottom: 15px;
}
.login-code {
align-self: center;
}
}
</style>

584
chenhai-ui/src/views/loginGld.vue

@ -0,0 +1,584 @@
<template>
<div class="login">
<!-- 登录模块 -->
<div class="login-form">
<!-- 左侧登录部分 -->
<div class="login-left">
<div class="left-content">
<div>
<svg t="1767064507714" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4145" width="100" height="100"><path d="M446.464 684.544c-24.576 0-44.544-19.968-44.544-44.544V445.952c0-24.576 19.968-44.544 44.544-44.544 24.576 0 44.544 19.968 44.544 44.544V640c0 24.576-19.968 44.544-44.544 44.544z" p-id="4146" fill="#95DBD4"></path><path d="M305.152 543.232c0-24.576 19.968-44.544 44.544-44.544h194.048c24.576 0 44.544 19.968 44.544 44.544 0 24.576-19.968 44.544-44.544 44.544H349.696c-24.576 0.512-44.544-19.456-44.544-44.544z" p-id="4147" fill="#95DBD4"></path><path d="M1012.736 748.032v-1.536c-2.048-20.48-7.168-40.448-14.848-58.368-10.752-28.16-27.648-52.224-49.664-70.656-11.776-9.728-24.576-17.92-38.912-24.064-14.336-6.656-29.696-10.752-45.568-13.312-3.584-0.512-7.68-1.024-11.264-1.536-2.048 0-3.584-0.512-5.632-0.512-5.632-0.512-11.264-1.024-17.408-1.024-10.24 0-20.48 1.024-30.208 2.56-26.624 4.096-51.712 13.824-73.216 27.648-12.288 7.168-24.064 15.36-35.328 24.576-13.312 11.264-26.624 23.04-39.424 34.816-13.312 12.288-26.624 25.088-40.448 37.376-2.56 2.56-5.12 4.608-8.192 7.168-21.504 18.944-43.52 33.792-67.072 44.544-23.04 10.752-47.616 17.408-73.216 19.968-4.608 0.512-9.216 1.024-13.824 1.024-17.92 0.512-36.352-1.024-55.296-5.12-19.968-4.096-37.888-9.728-54.784-17.408-1.536-1.024-3.584-1.536-5.12-2.56-37.888-19.968-69.632-50.176-91.136-87.04-7.68-13.312-13.824-28.16-18.944-43.52-4.096-12.8-7.168-25.6-9.216-37.888-0.512-3.072-1.024-6.656-1.536-9.728-0.512-6.656-1.024-13.312-1.024-19.968 0-22.528 3.072-44.032 9.216-64.512 3.072-9.728 6.656-18.944 11.264-28.16 8.704-18.944 20.48-36.864 34.304-53.76 31.232-35.84 73.216-61.44 121.344-71.68 6.656-1.536 13.824-2.56 20.48-3.072 1.536 0 3.072-0.512 4.608-0.512 1.536 0 3.072-0.512 4.608-0.512 5.632-0.512 11.776-1.024 17.92-1.024 9.728 0 18.944 0.512 28.16 1.536 51.712 6.656 97.792 30.72 132.096 66.048 10.752 11.264 19.968 24.064 28.16 37.888 1.536 2.048 2.56 4.608 3.584 6.656 1.024 2.56 2.56 4.096 3.584 5.632l3.072 3.072c2.56 2.048 5.632 2.56 9.216 2.048 1.024 0 1.536-0.512 2.56-1.024 2.56-1.024 5.632-3.584 8.704-6.656 6.656-8.192 12.288-15.36 17.92-23.04 3.584-5.12 7.68-9.728 10.752-14.848 55.296-75.264 87.552-168.448 87.552-268.8 0-28.672-2.56-56.32-7.68-83.456-1.536-7.168-8.704-11.264-15.36-8.704-2.048 1.024-4.096 1.536-6.144 2.048-1.024 0.512-1.536 0.512-2.56 1.024-47.616 17.408-91.648 43.008-130.56 74.24-3.584 3.072-7.68 6.144-10.752 9.216-2.56 2.56-5.632 4.608-8.192 7.168-3.584 2.56-7.68 4.096-11.264 5.12-2.048 0.512-4.096 0.512-6.656 0.512-2.048 0-4.096 0-6.656-0.512-1.536-0.512-2.56-1.024-4.096-1.536h-0.512c-0.512 0-1.024-0.512-1.536-0.512-5.12-1.536-10.752-3.072-15.872-4.608-34.304-8.704-70.144-13.312-107.008-13.312-36.352 0-71.68 4.608-105.472 13.312-5.632 1.536-10.752 3.072-15.872 4.608-2.048-1.024-4.608 0-7.168 1.024-1.536 0-3.584 0.512-5.12 0.512-1.536 0-3.072 0-4.608-0.512-5.12-1.024-9.216-2.56-13.312-5.12l-0.512-0.512c-2.048-1.536-4.096-3.584-6.144-5.632-4.096-3.584-8.192-7.168-12.8-10.752-29.696-24.064-62.464-44.544-97.792-60.928-0.512-0.512-1.536-0.512-2.048-1.024-0.512 0-1.024-0.512-1.024-0.512-10.752-5.12-21.504-9.216-32.768-13.312-3.072-1.024-5.632-2.048-8.704-3.072-6.656-2.56-13.824 2.048-15.36 9.216-0.512 2.048-1.024 4.608-1.024 6.656 0 1.024-0.512 1.536-0.512 2.56-4.096 24.576-6.144 49.664-6.144 75.264 0 28.672 2.56 56.32 7.68 83.456 1.024 6.144 1.536 12.288 2.56 18.432 0.512 4.608 1.024 9.216 2.048 13.312 0.512 2.048 0.512 4.096 0.512 6.144 0.512 7.68-1.536 14.336-4.608 20.992C66.048 329.728 35.84 389.632 20.48 455.68c-2.048 8.704-3.584 17.408-5.12 26.112-3.072 18.944-5.12 37.888-5.632 57.344v12.288c0 136.704 64.512 258.56 164.352 336.896 72.704 56.832 164.352 90.624 263.68 90.624 90.624 0 174.592-28.16 243.2-76.288 1.024-0.512 2.048-1.536 3.072-2.048 5.632-4.096 11.264-8.192 16.896-12.8 16.384-13.312 32.256-27.136 47.104-43.008 6.656-6.656 13.824-13.312 20.48-19.968 1.536-1.536 3.072-3.072 4.608-4.096 5.12-5.12 9.728-9.728 14.848-14.336l19.968-18.432c16.384-14.848 33.28-26.624 51.2-34.816 24.064-10.752 50.176-16.384 78.336-16.384 25.6 0 49.664 5.12 71.68 13.824h1.024c1.024 0 1.536-0.512 2.56-1.024-0.512 0 0-0.512 0-1.536z" p-id="4148" fill="#95DBD4"></path></svg>
</div>
<div class="welcome-text">Welcome to log in</div>
<hr class="divider">
<h3 class="title">"与牧同行"管理端</h3>
<div class="slogan">
<div class="icon-info">
<svg t="1767603518204" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13872" width="20" height="20"><path d="M191.90624 190.952007l641.318274 0 0 448.933639L191.90624 639.885646 191.90624 190.952007 191.90624 190.952007zM868.691283 61.809741 156.493705 61.809741c-50.994418 0-92.339058 41.434691-92.339058 92.553952l0 520.745175c0 51.116191 41.336454 92.553952 92.339058 92.553952l223.89428 0 0 127.747499L222.537887 895.41032c-17.569144 0-31.81152 14.246469-31.81152 31.807427 0 17.569144 14.242376 31.815613 31.81152 31.815613L800.750915 959.033359c17.569144 0 31.815613-14.246469 31.815613-31.815613 0-17.560958-14.246469-31.807427-31.815613-31.807427L641.028167 895.41032 641.028167 767.663844l227.66414 0c50.998511 0 92.342128-41.437761 92.342128-92.553952L961.034435 154.363693C961.033411 103.252619 919.689794 61.809741 868.691283 61.809741L868.691283 61.809741zM898.61071 704.558597 127.961882 704.558597 127.961882 127.477346l770.647805 0L898.609687 704.558597 898.61071 704.558597zM898.61071 704.558597" fill="#CDCDCD" p-id="13873"></path></svg><path d="M384 768v42.666667h-42.325333C318.08 810.666667 298.666667 830.08 298.666667 853.674667c0 22.912 18.773333 42.325333 42.325333 42.325333h341.973333A42.666667 42.666667 0 0 0 725.333333 852.992 43.093333 43.093333 0 0 0 682.325333 810.666667H640v-42.666667h213.333333a85.333333 85.333333 0 0 0 85.333334-85.333333V213.333333a85.333333 85.333333 0 0 0-85.333334-85.333333H170.666667a85.333333 85.333333 0 0 0-85.333334 85.333333v469.333334a85.333333 85.333333 0 0 0 85.333334 85.333333h213.333333z m469.333333-85.333333H170.666667V213.333333h682.666666v469.333334z" p-id="12221" fill="#CDCDCD"></path></svg><path d="M191.90624 190.952007l641.318274 0 0 448.933639L191.90624 639.885646 191.90624 190.952007 191.90624 190.952007zM868.691283 61.809741 156.493705 61.809741c-50.994418 0-92.339058 41.434691-92.339058 92.553952l0 520.745175c0 51.116191 41.336454 92.553952 92.339058 92.553952l223.89428 0 0 127.747499L222.537887 895.41032c-17.569144 0-31.81152 14.246469-31.81152 31.807427 0 17.569144 14.242376 31.815613 31.81152 31.815613L800.750915 959.033359c17.569144 0 31.815613-14.246469 31.815613-31.815613 0-17.560958-14.246469-31.807427-31.815613-31.807427L641.028167 895.41032 641.028167 767.663844l227.66414 0c50.998511 0 92.342128-41.437761 92.342128-92.553952L961.034435 154.363693C961.033411 103.252619 919.689794 61.809741 868.691283 61.809741L868.691283 61.809741zM898.61071 704.558597 127.961882 704.558597 127.961882 127.477346l770.647805 0L898.609687 704.558597 898.61071 704.558597zM898.61071 704.558597" fill="#CDCDCD" p-id="7961"></path></svg>
<div class="icon-text">一站通登筑牢账号防线</div>
</div>
<div class="icon-info">
<svg t="1766995101015" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3669" width="20" height="20"><path d="M873.767394 852.441693" fill="#cdcdcd" p-id="3670"></path><path d="M510.567371 64.413032c-247.00565 0-447.24416 200.236464-447.24416 447.24416S263.560698 958.902376 510.567371 958.902376c94.481861 0 182.116781-29.296233 254.322289-79.300091-0.151449-0.054235-0.293689-0.11768-0.445138-0.171915 7.319709-5.901407 12.010545-14.936177 12.010545-25.069979 0-17.774829-14.404058-32.178887-32.17991-32.178887-9.717316 0-18.424628 4.314259-24.327058 11.124362-0.01535-0.054235-0.038886-0.102331-0.054235-0.156566-60.0824 39.025828-131.771139 61.701271-208.753441 61.701271-211.946157 0-383.761314-171.817204-383.761314-383.76643 0-211.94411 171.816181-383.761314 383.761314-383.761314 211.94411 0 383.760291 171.817204 383.760291 383.761314 0 87.044472-28.984125 167.316703-77.819366 231.699036-6.610558 5.892197-10.778484 14.473643-10.778484 24.02416 0 17.770735 14.404058 32.17991 32.17991 32.17991 8.271384 0 15.815197-3.127224 21.518083-8.258081 0.005117 0.024559 0.01535 0.044002 0.01842 0.068562 0.083911-0.102331 0.161682-0.204661 0.245593-0.308015 2.62785-2.424212 4.856611-5.27719 6.566556-8.452509 57.082066-75.097372 90.982154-168.775938 90.982154-270.381034C957.812555 264.649496 757.574045 64.413032 510.567371 64.413032z" fill="#cdcdcd" p-id="3671"></path><path d="M284.899702 638.201284 490.980267 762.180969 490.980267 519.241938 284.899702 395.258159Z" fill="#cdcdcd" p-id="3672"></path><path d="M504.383532 260.072247 310.031079 360.600825 511.162936 487.178685 712.290699 383.848295Z" fill="#cdcdcd" p-id="3673"></path><path d="M533.799492 518.124488 533.799492 761.063519 735.00298 657.734152 735.007073 657.734152 735.007073 414.795121Z" fill="#cdcdcd" p-id="3674"></path></svg>
<div class="icon-text">资源聚合资讯产品赋能</div>
</div>
<div class="icon-info">
<svg t="1766995362770" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10345" width="20" height="20"><path d="M730.453 749.277c-16.711 0-30.838 11.286-35.098 26.578H430.881c-27.197 0-55.924 15.984-70.997 38.703l-39.14 37.137-0.073-14.309a36.955 36.955 0 0 0-4.187-16.784c-13.69-25.887-45.038-44.71-74.638-44.71H184.32V366.364h12.124a36.409 36.409 0 1 0 0-72.817h-24.248c-33.46 0-60.694 28.29-60.694 63.06v429.079c0 34.77 27.307 62.987 60.84 62.987h69.468a16.093 16.093 0 0 1 6.116 2.44l0.328 52.173a36.336 36.336 0 0 0 7.537 21.991c11.541 15.037 28.435 23.666 46.312 23.63h0.036c16.785 0 32.732-7.646 44.164-21.008l67.247-63.934c2.221-2.112 5.425-6.627 7.027-9.248a18.168 18.168 0 0 1 10.304-6.008h275.324a60.439 60.439 0 0 0 53.812-33.933 36.045 36.045 0 0 0 6.845-21.262v-7.828a36.409 36.409 0 0 0-36.409-36.41" p-id="10346" fill="#cdcdcd"></path><path d="M876.089 557.438h-57.526c-18.241 0-36.664 7.683-51.7 19.224-3.46 2.658-7.1 5.061-10.122 8.156a78.206 78.206 0 0 0-12.816 17.33 36.7 36.7 0 0 0-4.187 16.748l-0.073 14.382-39.14-37.173c-2.73-4.115-6.299-7.683-9.83-11.287-15.984-16.384-38.885-27.38-61.167-27.38H366.364V147.911H876.09v409.527z m66.956-445.936c-9.721-21.445-30.547-36.409-54.832-36.409H354.24c-24.284 0-45.11 14.964-54.832 36.41a64.808 64.808 0 0 0-5.861 26.614v429.115c0 6.153 1.128 11.979 2.694 17.586 7.39 26.178 30.438 45.438 57.963 45.438H629.49a18.168 18.168 0 0 1 10.268 5.898 35.717 35.717 0 0 0 7.1 9.357l67.247 63.934c11.432 13.399 27.38 21.008 44.164 21.008h0.036c17.877 0 34.77-8.592 46.312-23.629a36.336 36.336 0 0 0 7.537-21.991l0.328-52.21a15.437 15.437 0 0 1 6.08-2.367h69.504c27.598 0 50.718-19.26 58.109-45.438 1.602-5.607 2.73-11.433 2.73-17.586V138.117a64.808 64.808 0 0 0-5.861-26.615z" p-id="10347" fill="#cdcdcd"></path><path d="M530.204 293.547a54.613 54.613 0 1 0 0.037 109.263 54.613 54.613 0 0 0-0.037-109.227m182.045-0.036a54.613 54.613 0 1 0 0.036 109.263 54.613 54.613 0 0 0-0.036-109.227" p-id="10348" fill="#cdcdcd"></path></svg>
<div class="icon-text">用户生态互动管理共生</div>
</div>
</div>
</div>
</div>
<!-- 右侧登录部分 -->
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-right">
<div class="admin-text">欢迎登录</div>
<el-form-item prop="username ">
<el-input
v-model="loginForm.username "
type="text"
auto-complete="off"
placeholder="账号"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginForm.password"
:type="passwordVisible ? 'text' : 'password'"
auto-complete="off"
placeholder="密码"
@keyup.enter.native="handleLogin"
class="custom-input"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
<template slot="suffix">
<svg-icon
:icon-class="passwordVisible ? 'eye-open' : 'eye'"
class="el-input__icon eye-icon"
@click="passwordVisible = !passwordVisible"
/>
</template>
</el-input>
</el-form-item>
<!-- <el-form-item prop="code" v-if="captchaEnabled" class="code-form-item">-->
<!-- <div class="code-container">-->
<!-- <el-input-->
<!-- v-model="loginForm.code"-->
<!-- auto-complete="off"-->
<!-- placeholder="验证码"-->
<!-- @keyup.enter.native="handleLogin"-->
<!-- class="custom-input code-input"-->
<!-- >-->
<!-- <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />-->
<!-- </el-input>-->
<!-- <div class="login-code">-->
<!-- <img :src="codeUrl" @click="getCode" class="login-code-img"/>-->
<!-- </div>-->
<!-- </div>-->
<!-- </el-form-item>-->
<div class="form-bottom">
<el-checkbox v-model="loginForm.rememberMe" class="remember-checkbox">记住密码</el-checkbox>
<el-form-item class="login-btn-item">
<el-button
:loading="loading"
size="medium"
type="primary"
class="login-btn"
@click.native.prevent="handleLogin"
>
<span v-if="!loading">登录</span>
<span v-else> 中...</span>
</el-button>
</el-form-item>
</div>
<div class="sponsored-info">
<span >© 2025-2026 内蒙古琛海科技有限公司</span>
<span class="sponsored">v1.0.1</span>
</div>
</el-form>
</div>
</div>
</template>
<script>
import { login } from "@/api/login"
import Cookies from "js-cookie"
import { encrypt, decrypt } from '@/utils/jsencrypt'
export default {
name: "LoginGid",
data() {
return {
title: process.env.VUE_APP_TITLE,
// codeUrl: "",
passwordVisible: false,
loginForm: {
username: "",
password: "",
rememberMe: false,
// code: "",
// uuid: ""
},
loginRules: {
username: [
{ required: true, trigger: "blur", message: "请输入您的账号" }
],
password: [
{ required: true, trigger: "blur", message: "请输入您的密码" }
]
// code: [{ required: true, trigger: "change", message: "" }]
},
loading: false,
//
// captchaEnabled: true,
redirect: undefined
}
},
watch: {
$route: {
handler: function(route) {
this.redirect = route.query && route.query.redirect
},
immediate: true
}
},
created() {
// this.getCode()
this.getCookie()
},
methods: {
// getCode() {
// getCodeImg().then(res => {
// this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
// if (this.captchaEnabled) {
// this.codeUrl = "data:image/gif;base64," + res.img
// this.loginForm.uuid = res.uuid
// }
// })
// },
getCookie() {
const username = Cookies.get("username ")
const password = Cookies.get("password")
const rememberMe = Cookies.get('rememberMe')
this.loginForm = {
username : username === undefined ? this.loginForm.username : username ,
password: password === undefined ? this.loginForm.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
}
},
handleLogin() {
this.$refs.loginForm.validate(valid => {
if (valid) {
this.loading = true
if (this.loginForm.rememberMe) {
Cookies.set("username", this.loginForm.username , { expires: 30 })
Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 })
Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 })
} else {
Cookies.remove("username")
Cookies.remove("password")
Cookies.remove('rememberMe')
}
this.$store.dispatch("LoginGld", this.loginForm).then(() => {
this.$router.push({ path: this.redirect || '/indexGld' }).catch(()=>{})
}).catch(() => {
this.loading = false
// if (this.captchaEnabled) {
// this.getCode()
// }
})
}
})
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/* 登录页 */
.login {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
width: 100vw;
background-color: #e6f7ff;
overflow: hidden;
position: relative;
}
/* 登录模块 */
.login-form {
display: flex;
width: 760px;
height: 450px;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
position: relative;
z-index: 2;
backdrop-filter: blur(5px);
background-color: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(82, 196, 26, 0.2);
}
/* 左侧登录部分 */
.login-left {
flex: 1;
background: linear-gradient(135deg, rgba(82, 196, 26, 0.9) 0%, rgba(24, 144, 255, 0.9) 100%);
display: flex;
justify-content: center;
align-items: center;
position: relative;
padding: 40px;
}
.login-left::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(255, 255, 255, 0.1);
z-index: 1;
}
.left-content {
position: relative;
z-index: 2;
text-align: center;
color: white;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.welcome-text {
font-size: 24px;
font-weight: 300;
line-height: 1.5;
color: rgba(255, 255, 255, 0.95);
}
.divider {
width: 100px;
height: 3px;
background: linear-gradient(90deg,
transparent 0%,
rgba(255, 255, 255, 0.8) 50%,
transparent 100%
);
border: none;
margin: 0 auto 30px;
}
.title {
font-size: 32px;
font-weight: 600;
margin: 0 0 20px 0;
color: white;
letter-spacing: 2px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
text-align: center;
}
.slogan {
.icon-info{
display: flex;
align-items: center;
justify-content: center;
margin: 10px;
transition: all 0.3s ease;
&:hover {
transform: translateY(-2px);
filter: drop-shadow(0 4px 8px rgba(255, 255, 255, 0.2));
}
svg {
transition: all 0.3s ease;
filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}
&:hover svg {
transform: scale(1.1);
filter: drop-shadow(0 4px 8px rgba(255, 255, 255, 0.3));
}
}
.icon-text{
padding: 10px;
font-size: 12px;
font-weight: 500;
line-height: 1.5em;
color: rgba(255, 255, 255, 0.9);
transition: all 0.3s ease;
}
.icon-info:hover .icon-text {
color: white;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
}
/* 右侧登录部分 */
.login-right {
flex: 1;
background: rgba(255, 255, 255, 0.95);
padding: 60px 50px;
display: flex;
flex-direction: column;
justify-content: center;
}
.admin-text {
font-size: 20px;
color: #333;
text-align: center;
font-weight: 600;
position: relative;
margin: 20px 0;
}
.admin-text::before,
.admin-text::after {
content: '';
position: absolute;
top: 50%;
width: 70px;
height: 2px;
background: linear-gradient(90deg,
transparent 0%,
#52c41a 50%,
transparent 100%)
}
.admin-text::before {
left: 10px;
}
.admin-text::after {
right: 10px;
}
.custom-input {
::v-deep .el-input__inner {
border: 1px solid #e8e8e8;
border-radius: 6px;
background-color: rgba(250, 250, 250, 0.9);
color: #333;
padding-left: 40px;
padding-right: 40px;
transition: all 0.3s;
&:focus {
border-color: #52c41a;
background-color: white;
box-shadow: 0 0 0 2px rgba(82, 196, 26, 0.2);
}
&::placeholder {
color: #999;
}
}
}
.eye-icon {
cursor: pointer;
margin-right: 10px;
color: #999;
transition: color 0.3s;
&:hover {
color: #52c41a;
}
}
.remember-checkbox {
::v-deep .el-checkbox__inner {
border-color: #52c41a;
&:hover {
border-color: #73d13d;
}
}
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #52c41a;
border-color: #52c41a;
}
::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
color: #52c41a;
}
::v-deep .el-checkbox__label {
color: #666;
font-size: 14px;
}
}
//.code-form-item {
// .el-form-item__content {
// display: flex;
// align-items: center;
// justify-content: center;
// }
//}
//
//.code-container {
// display: flex;
// align-items: center;
// width: 100%;
// justify-content: space-between;
//}
//
//.code-input {
// flex: 1;
// margin-right: 15px;
//
// ::v-deep .el-input__inner {
// width: 100%;
// }
//}
.input-icon {
color: #999;
margin-left: 8px;
}
.form-bottom {
display: flex;
flex-direction: column;
}
.login-tips{
}
.login-btn-item {
margin-top: 20px;
margin-bottom: 0;
width: 100%;
}
.login-btn {
width: 100%;
height: 44px;
background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
border: none;
border-radius: 6px;
font-size: 16px;
font-weight: 500;
transition: all 0.3s;
color: white;
letter-spacing: 2px;
&:hover {
opacity: 0.9;
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(82, 196, 26, 0.4);
}
&:active {
transform: translateY(0);
}
}
//.login-code {
// height: 44px;
// flex-shrink: 0;
//
// .login-code-img {
// height: 44px;
// width: 120px;
// border-radius: 6px;
// cursor: pointer;
// border: 1px solid #e8e8e8;
// transition: all 0.3s;
//
// &:hover {
// transform: translateY(-1px);
// box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
// }
// }
//}
.sponsored-info{
text-align: center;
font-size: 12px;
color: #999;
border-top: 1px solid #f0f0f0;
padding-top: 15px;
.sponsored{
margin-left: 10px;
padding: 2px 6px;
background: rgba(82, 196, 26, 0.1);
border-radius: 4px;
font-family: monospace;
}
}
.el-form-item {
margin-bottom: 24px;
&.is-error {
.custom-input {
::v-deep .el-input__inner {
border-color: #f5222d;
}
}
}
}
/* 响应式调整 */
@media (max-width: 992px) {
.login-form {
width: 90%;
max-width: 800px;
height: auto;
min-height: 500px;
flex-direction: column;
}
.login-left, .login-right {
flex: none;
width: 100%;
}
.login-left {
padding: 30px 20px;
min-height: 200px;
}
.login-right {
padding: 40px 30px;
}
.code-container {
flex-direction: column;
align-items: stretch;
}
.code-input {
margin-right: 0;
margin-bottom: 15px;
}
.login-code {
align-self: center;
}
}
</style>

60
chenhai-ui/src/views/muhu/ads/index.vue

@ -1,6 +1,18 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<!-- 搜索部分 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="轮播类型" prop="adsType">
<el-select v-model="queryParams.adsType" placeholder="请选择轮播类型" clearable>
<el-option
v-for="dict in dict.type.ads_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
@keyup.enter.native="handleQuery"
/>
</el-select>
</el-form-item>
<el-form-item label="广告标题" prop="title">
<el-input
v-model="queryParams.title"
@ -56,19 +68,20 @@
v-hasPermi="['muhu:ads:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['muhu:ads:export']"
>导出</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['muhu:ads:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 表格部分 -->
<el-table v-loading="loading" :data="adsList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="轮播类型" align="center" prop="adsType">
@ -90,6 +103,8 @@
size="mini"
type="text"
icon="el-icon-edit"
style="color: #42B983"
class = "asd-btn alter-btn"
@click="handleUpdate(scope.row)"
v-hasPermi="['muhu:ads:edit']"
>修改</el-button>
@ -97,6 +112,8 @@
size="mini"
type="text"
icon="el-icon-delete"
style="color: #f28888"
class = "asd-btn delete-btn"
@click="handleDelete(scope.row)"
v-hasPermi="['muhu:ads:remove']"
>删除</el-button>
@ -341,3 +358,24 @@ export default {
}
}
</script>
<style scoped lang="scss">
/* 操作按钮样式 */
.asd-btn {
padding: 6px 10px;
border-radius: 4px;
margin: 0 10px;
transition: all 0.3s ease;
}
.alter-btn:hover{
background-color: rgb(230, 255, 238);
transform: translateY(-1px);
}
.delete-btn:hover {
background-color: rgba(245, 108, 108, 0.1);
transform: translateY(-1px);
}
</style>

77
chenhai-ui/src/views/muhu/warning/index.vue

@ -1,6 +1,31 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="预警类型" prop="warningType">
<el-select v-model="queryParams.warningType" placeholder="请选择预警类型" clearable>
<el-option
v-for="dict in dict.type.warning_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
@keyup.enter.native="handleQuery"
/>
</el-select>
</el-form-item>
<el-form-item label="预警级别" prop="warningLevel">
<el-select v-model="queryParams.warningLevel" placeholder="请选择预警级别" clearable>
<el-option
v-for="dict in dict.type.warning_level"
:key="dict.value"
:label="dict.label"
:value="dict.value"
@keyup.enter.native="handleQuery"
/>
</el-select>
</el-form-item>
<el-form-item label="预警标题" prop="title">
<el-input
v-model="queryParams.title"
@ -9,6 +34,7 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@ -48,16 +74,16 @@
v-hasPermi="['muhu:warning:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['muhu:warning:export']"
>导出</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['muhu:warning:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@ -76,6 +102,8 @@
size="mini"
type="text"
icon="el-icon-edit"
style="color: #42B983"
class = "warning-btn alter-btn"
@click="handleUpdate(scope.row)"
v-hasPermi="['muhu:warning:edit']"
>修改</el-button>
@ -83,6 +111,8 @@
size="mini"
type="text"
icon="el-icon-delete"
style="color: #f28888"
class = "warning-btn delete-btn"
@click="handleDelete(scope.row)"
v-hasPermi="['muhu:warning:remove']"
>删除</el-button>
@ -99,11 +129,11 @@
/>
<!-- 添加或修改灾害预警信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="预警类型" prop="warningType">
<el-select v-model="form.warningType" placeholder="请选择预警类型" clearable>
<el-option v-for="dict in dict.type.warning_type" :key="dict.value" :label="dict.label" :value="dict.value" />
<el-option v-for="dict in dict.type.warning_type" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="预警级别" prop="warningLevel">
@ -301,3 +331,24 @@ export default {
}
}
</script>
<style scoped lang="scss">
/* 操作按钮样式 */
.warning-btn {
padding: 6px 10px;
border-radius: 4px;
margin: 0 10px;
transition: all 0.3s ease;
}
.alter-btn:hover{
background-color: rgb(230, 255, 238);
transform: translateY(-1px);
}
.delete-btn:hover {
background-color: rgba(245, 108, 108, 0.1);
transform: translateY(-1px);
}
</style>

118
chenhai-ui/src/views/vet/certificate/index.vue

@ -1,14 +1,15 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="用户ID" prop="userId">
<el-input
v-model="queryParams.userId"
placeholder="请输入用户ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- 搜索部分 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<!-- <el-form-item label="用户ID" prop="userId">-->
<!-- <el-input-->
<!-- v-model="queryParams.userId"-->
<!-- placeholder="请输入用户ID"-->
<!-- clearable-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="证书名称" prop="certName">
<el-input
v-model="queryParams.certName"
@ -57,14 +58,14 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="上次提醒时间" prop="lastRemindTime">
<el-date-picker clearable
v-model="queryParams.lastRemindTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择上次提醒时间">
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="上次提醒时间" prop="lastRemindTime">-->
<!-- <el-date-picker clearable-->
<!-- v-model="queryParams.lastRemindTime"-->
<!-- type="date"-->
<!-- value-format="yyyy-MM-dd"-->
<!-- placeholder="请选择上次提醒时间">-->
<!-- </el-date-picker>-->
<!-- </el-form-item>-->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@ -104,23 +105,24 @@
v-hasPermi="['vet:certificate:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['vet:certificate:export']"
>导出</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['system:certificate:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 表格部分 -->
<el-table v-loading="loading" :data="certificateList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键ID" align="center" prop="id" />
<el-table-column label="用户ID" align="center" prop="userId" />
<!-- <el-table-column label="主键ID" align="center" prop="id" />-->
<!-- <el-table-column label="用户ID" align="center" prop="userId" />-->
<el-table-column label="证书名称" align="center" prop="certName" />
<el-table-column label="证书编号" align="center" prop="certNumber" />
<el-table-column label="证书类型" align="center" prop="certType" />
@ -153,15 +155,19 @@
size="mini"
type="text"
icon="el-icon-edit"
style="color: #42B983"
class = "certificate-btn alter-btn"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:certificate:edit']"
v-hasPermi="['vet:certificate:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
style="color: #f28888"
class = "certificate-btn delete-btn"
@click="handleDelete(scope.row)"
v-hasPermi="['system:certificate:remove']"
v-hasPermi="['vet:certificate:remove']"
>删除</el-button>
</template>
</el-table-column>
@ -178,9 +184,9 @@
<!-- 添加或修改兽医执业证书对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="用户ID" prop="userId">
<el-input v-model="form.userId" placeholder="请输入用户ID" />
</el-form-item>
<!-- <el-form-item label="用户ID" prop="userId">-->
<!-- <el-input v-model="form.userId" placeholder="请输入用户ID" />-->
<!-- </el-form-item>-->
<el-form-item label="证书名称" prop="certName">
<el-input v-model="form.certName" placeholder="请输入证书名称" />
</el-form-item>
@ -234,6 +240,10 @@ import { listCertificate, getCertificate, delCertificate, addCertificate, update
export default {
name: "Certificate",
props: {
formList: Object,
certificateList: Array
},
data() {
return {
//
@ -248,8 +258,10 @@ export default {
showSearch: true,
//
total: 0,
//
certificateList: [],
// certificateList: [],
//
title: "",
//
@ -286,12 +298,12 @@ export default {
methods: {
/** 查询兽医执业证书列表 */
getList() {
this.loading = true
listCertificate(this.queryParams).then(response => {
this.certificateList = response.rows
this.total = response.total
this.loading = false
})
this.loading = false
// listCertificate(this.queryParams).then(response => {
// this.certificateList = response.rows
// this.total = response.total
// this.loading = false
// })
},
//
cancel() {
@ -384,10 +396,32 @@ export default {
},
/** 导出按钮操作 */
handleExport() {
this.download('vet/certificate/export', {
this.download('system/certificate/export', {
...this.queryParams
}, `certificate_${new Date().getTime()}.xlsx`)
}
}
}
</script>
<style scoped lang="scss">
/* 操作按钮样式 */
.certificate-btn {
padding: 6px 10px;
border-radius: 4px;
margin: 0 10px;
transition: all 0.3s ease;
}
.alter-btn:hover{
background-color: rgb(230, 255, 238);
transform: translateY(-1px);
}
.delete-btn:hover {
background-color: rgba(245, 108, 108, 0.1);
transform: translateY(-1px);
}
</style>

156
chenhai-ui/src/views/vet/info/index.vue

@ -1,14 +1,15 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="用户ID" prop="userId">
<el-input
v-model="queryParams.userId"
placeholder="请输入用户ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- 搜索部分 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<!-- <el-form-item label="用户ID" prop="userId">-->
<!-- <el-input-->
<!-- v-model="queryParams.userId"-->
<!-- placeholder="请输入用户ID"-->
<!-- clearable-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="真实姓名" prop="realName">
<el-input
v-model="queryParams.realName"
@ -25,14 +26,14 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="出生日期" prop="birthday">
<el-date-picker clearable
v-model="queryParams.birthday"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择出生日期">
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="出生日期" prop="birthday">-->
<!-- <el-date-picker clearable-->
<!-- v-model="queryParams.birthday"-->
<!-- type="date"-->
<!-- value-format="yyyy-MM-dd"-->
<!-- placeholder="请选择出生日期">-->
<!-- </el-date-picker>-->
<!-- </el-form-item>-->
<el-form-item label="身份证号" prop="idCard">
<el-input
v-model="queryParams.idCard"
@ -57,14 +58,14 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="联系地址" prop="address">
<el-input
v-model="queryParams.address"
placeholder="请输入联系地址"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- <el-form-item label="联系地址" prop="address">-->
<!-- <el-input-->
<!-- v-model="queryParams.address"-->
<!-- placeholder="请输入联系地址"-->
<!-- clearable-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@ -104,42 +105,54 @@
v-hasPermi="['vet:info:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['vet:info:export']"
>导出</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['system:info:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 表格部分 -->
<el-table v-loading="loading" :data="infoList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键ID" align="center" prop="id" />
<el-table-column label="用户ID" align="center" prop="userId" />
<!-- <el-table-column label="主键ID" align="center" prop="id" />-->
<!-- <el-table-column label="用户ID" align="center" prop="userId" />-->
<el-table-column label="真实姓名" align="center" prop="realName" />
<el-table-column label="性别" align="center" prop="gender" />
<el-table-column label="出生日期" align="center" prop="birthday" width="180">
<el-table-column label="出生日期" align="center" prop="birthday">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.birthday, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="身份证号" align="center" prop="idCard" />
<el-table-column label="身份证号" align="center" prop="idCard" width="180"/>
<el-table-column label="擅长领域" align="center" prop="specialty" />
<el-table-column label="工作经验" align="center" prop="workExperience" />
<el-table-column label="工作经验" align="center" prop="workExperience"/>
<el-table-column label="所属医院" align="center" prop="hospital" />
<el-table-column label="联系地址" align="center" prop="address" />
<el-table-column label="个人简介" align="center" prop="introduction" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="180">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
style="color: #e6a23c"
class = "info-btn view-btn"
@click="handleView(scope.row)"
v-hasPermi="['vet:info:view']"
>详情</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
style="color: #42B983"
class = "info-btn alter-btn"
@click="handleUpdate(scope.row)"
v-hasPermi="['vet:info:edit']"
>修改</el-button>
@ -147,6 +160,8 @@
size="mini"
type="text"
icon="el-icon-delete"
style="color: #f28888"
class = "info-btn delete-btn"
@click="handleDelete(scope.row)"
v-hasPermi="['vet:info:remove']"
>删除</el-button>
@ -206,14 +221,23 @@
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<!-- 详情对话框 -->
<el-dialog :title="title" :visible.sync="flag" width="1400px" append-to-body>
<Certificate :form-list="form" :certificateList="certificateList"></Certificate>
</el-dialog>
</div>
</template>
<script>
import { listInfo, getInfo, delInfo, addInfo, updateInfo } from "@/api/vet/info"
import { listInfo, getInfo, getfull, delInfo, addInfo, updateInfo } from "@/api/vet/info"
import Certificate from "../certificate/index.vue"
export default {
name: "Info",
components:{
Certificate,
},
data() {
return {
//
@ -230,10 +254,15 @@ export default {
total: 0,
//
infoList: [],
//
certificateList: [],
//
title: "",
//
open: false,
flag: false,
//
queryParams: {
pageNum: 1,
@ -297,6 +326,8 @@ export default {
updateTime: null
}
this.resetForm("form")
this.chCkApplyItemsList = []
},
/** 搜索按钮操作 */
handleQuery() {
@ -314,6 +345,18 @@ export default {
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 详情按钮操作 */
handleView(row) {
this.reset();
const id = row.id || this.ids
getfull(id).then(response => {
this.flag = true
// this.form = response.data;
this.form = response.data.personalInfo;
this.certificateList = response.data.certificates;
});
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
@ -362,10 +405,37 @@ export default {
},
/** 导出按钮操作 */
handleExport() {
this.download('vet/info/export', {
this.download('system/info/export', {
...this.queryParams
}, `info_${new Date().getTime()}.xlsx`)
}
}
}
</script>
<style scoped lang="scss">
/* 操作按钮样式 */
.info-btn {
padding: 6px 10px;
border-radius: 4px;
margin: 0 10px;
transition: all 0.3s ease;
}
.view-btn:hover{
background-color: rgba(243, 239, 231, 100);
transform: translateY(-1px);
}
.alter-btn:hover{
background-color: rgb(230, 255, 238);
transform: translateY(-1px);
}
.delete-btn:hover {
background-color: rgba(245, 108, 108, 0.1);
transform: translateY(-1px);
}
</style>

48
chenhai-ui/src/views/vet/notification/index.vue

@ -88,16 +88,16 @@
v-hasPermi="['vet:notification:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:notification:export']"
>导出</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['system:notification:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@ -122,15 +122,19 @@
size="mini"
type="text"
icon="el-icon-edit"
style="color: #42B983"
class = "notification-btn alter-btn"
@click="handleUpdate(scope.row)"
v-hasPermi="['vet:notification:edit']"
v-hasPermi="['vet:certificate:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
style="color: #f28888"
class = "notification-btn delete-btn"
@click="handleDelete(scope.row)"
v-hasPermi="['vet:notification:remove']"
v-hasPermi="['vet:certificate:remove']"
>删除</el-button>
</template>
</el-table-column>
@ -338,3 +342,23 @@ export default {
}
}
</script>
<style scoped lang="scss">
.notification-btn {
padding: 6px 10px;
border-radius: 4px;
margin: 0 10px;
transition: all 0.3s ease;
}
.alter-btn:hover{
background-color: rgb(230, 255, 238);
transform: translateY(-1px);
}
.delete-btn:hover {
background-color: rgba(245, 108, 108, 0.1);
transform: translateY(-1px);
}
</style>
Loading…
Cancel
Save