样式优化,uuid去除
|
After Width: | Height: | Size: 915 KiB |
|
After Width: | Height: | Size: 288 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 242 KiB |
|
After Width: | Height: | Size: 72 KiB |
|
After Width: | Height: | Size: 93 KiB |
|
After Width: | Height: | Size: 102 KiB |
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<div class="login">
|
||||
<img src="../assets/images/444.png" class="logo" alt="logo" />
|
||||
<div class="login-container">
|
||||
<!-- 左侧插图区域 -->
|
||||
<div class="login-left">
|
||||
|
|
@ -18,14 +19,14 @@
|
|||
:rules="loginRules"
|
||||
class="login-form"
|
||||
>
|
||||
<h3 class="title">{{ title }}</h3>
|
||||
<h3 class="title-text">品号高效检索系统</h3>
|
||||
<el-form-item prop="username">
|
||||
<el-input
|
||||
v-model="loginForm.username"
|
||||
type="text"
|
||||
size="large"
|
||||
auto-complete="off"
|
||||
placeholder="admin"
|
||||
placeholder="请输入账号"
|
||||
>
|
||||
<template #prefix
|
||||
><svg-icon icon-class="user" class="el-input__icon input-icon"
|
||||
|
|
@ -38,7 +39,7 @@
|
|||
:type="showPassword ? 'text' : 'password'"
|
||||
size="large"
|
||||
auto-complete="off"
|
||||
placeholder="密码"
|
||||
placeholder="请输入密码"
|
||||
@keyup.enter="handleLogin"
|
||||
>
|
||||
<template #prefix
|
||||
|
|
@ -115,17 +116,15 @@ import { getCodeImg } from "@/api/login";
|
|||
import Cookies from "js-cookie";
|
||||
import { encrypt, decrypt } from "@/utils/jsencrypt";
|
||||
import useUserStore from "@/store/modules/user";
|
||||
import { View, Hide } from "@element-plus/icons-vue";
|
||||
|
||||
const title = import.meta.env.VITE_APP_TITLE;
|
||||
const userStore = useUserStore();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const { proxy } = getCurrentInstance();
|
||||
|
||||
const loginForm = ref({
|
||||
username: "admin",
|
||||
password: "admin123",
|
||||
username: "",
|
||||
password: "",
|
||||
rememberMe: false,
|
||||
code: "",
|
||||
uuid: "",
|
||||
|
|
@ -242,48 +241,56 @@ getCookie();
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(135deg, #e3f2f5 0%, #d0e8eb 50%, #c5e3e6 100%);
|
||||
background: linear-gradient(to bottom, #449ac6 0%, #5dbbe4 100%);
|
||||
// background: linear-gradient(135deg, #e3f2f5 0%, #d0e8eb 50%, #c5e3e6 100%);
|
||||
position: relative;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
|
||||
// 底部背景图片 - 左侧
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 45%;
|
||||
height: 280px;
|
||||
min-height: 220px;
|
||||
background-image: url("../assets/images/logo_left.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: left bottom;
|
||||
background-size: contain;
|
||||
opacity: 0.5;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
filter: blur(0.5px);
|
||||
}
|
||||
// // 底部背景图片 - 左侧
|
||||
// &::before {
|
||||
// content: "";
|
||||
// position: absolute;
|
||||
// bottom: 0;
|
||||
// left: 0;
|
||||
// width: 45%;
|
||||
// height: 280px;
|
||||
// min-height: 220px;
|
||||
// background-image: url("../assets/images/logo_left.png");
|
||||
// background-repeat: no-repeat;
|
||||
// background-position: left bottom;
|
||||
// background-size: contain;
|
||||
// opacity: 0.5;
|
||||
// z-index: 0;
|
||||
// pointer-events: none;
|
||||
// filter: blur(0.5px);
|
||||
// }
|
||||
|
||||
// 底部背景图片 - 右侧
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 45%;
|
||||
height: 280px;
|
||||
min-height: 220px;
|
||||
background-image: url("../assets/images/logo_leftright.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right bottom;
|
||||
background-size: contain;
|
||||
opacity: 0.5;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
filter: blur(0.5px);
|
||||
}
|
||||
// // 底部背景图片 - 右侧
|
||||
// &::after {
|
||||
// content: "";
|
||||
// position: absolute;
|
||||
// bottom: 0;
|
||||
// right: 0;
|
||||
// width: 45%;
|
||||
// height: 280px;
|
||||
// min-height: 220px;
|
||||
// background-image: url("../assets/images/logo_leftright.png");
|
||||
// background-repeat: no-repeat;
|
||||
// background-position: right bottom;
|
||||
// background-size: contain;
|
||||
// opacity: 0.5;
|
||||
// z-index: 0;
|
||||
// pointer-events: none;
|
||||
// filter: blur(0.5px);
|
||||
// }
|
||||
}
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 45px;
|
||||
width: 18%;
|
||||
}
|
||||
|
||||
.login-container {
|
||||
|
|
@ -315,14 +322,15 @@ getCookie();
|
|||
.login-right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 40px 60px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 0px auto 35px auto;
|
||||
.title-text {
|
||||
margin: 0 auto 35px;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
font-size: 20px;
|
||||
|
|
@ -341,7 +349,7 @@ getCookie();
|
|||
|
||||
:deep(.el-form-item) {
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
|
@ -364,7 +372,7 @@ getCookie();
|
|||
:deep(.el-input__inner) {
|
||||
font-size: 15px;
|
||||
color: #333;
|
||||
|
||||
|
||||
&::placeholder {
|
||||
color: #a8abb2;
|
||||
font-size: 14px;
|
||||
|
|
@ -373,7 +381,7 @@ getCookie();
|
|||
|
||||
.el-input {
|
||||
height: 48px;
|
||||
|
||||
|
||||
input {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
|
|
@ -399,8 +407,8 @@ getCookie();
|
|||
}
|
||||
|
||||
:deep(.el-button--primary) {
|
||||
background-color: #20b2aa;
|
||||
border-color: #20b2aa;
|
||||
background-color: #5dbbe4;
|
||||
border-color: #5dbbe4;
|
||||
height: 48px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
|
|
@ -409,8 +417,8 @@ getCookie();
|
|||
transition: all 0.3s;
|
||||
|
||||
&:hover {
|
||||
background-color: #1a9b94;
|
||||
border-color: #1a9b94;
|
||||
background-color: #449ac6;
|
||||
border-color: #449ac6;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(32, 178, 170, 0.3);
|
||||
}
|
||||
|
|
@ -422,16 +430,16 @@ getCookie();
|
|||
|
||||
:deep(.el-checkbox) {
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
||||
.el-checkbox__label {
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
padding-left: 8px;
|
||||
}
|
||||
|
||||
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
background-color: #20b2aa;
|
||||
border-color: #20b2aa;
|
||||
background-color: #5dbbe4;
|
||||
border-color: #5dbbe4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -449,7 +457,7 @@ getCookie();
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
img {
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
|
|
@ -457,7 +465,7 @@ getCookie();
|
|||
border-radius: 8px;
|
||||
border: 1px solid #dcdfe6;
|
||||
transition: all 0.2s;
|
||||
|
||||
|
||||
&:hover {
|
||||
border-color: #409eff;
|
||||
}
|
||||
|
|
@ -478,7 +486,7 @@ getCookie();
|
|||
z-index: 10;
|
||||
background: transparent;
|
||||
pointer-events: none;
|
||||
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
opacity: 0.8;
|
||||
|
|
@ -512,7 +520,7 @@ getCookie();
|
|||
flex: 1;
|
||||
padding: 30px 20px;
|
||||
}
|
||||
|
||||
|
||||
.login {
|
||||
&::before,
|
||||
&::after {
|
||||
|
|
@ -536,7 +544,7 @@ getCookie();
|
|||
padding: 35px 28px 28px 28px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.login {
|
||||
&::before,
|
||||
&::after {
|
||||
|
|
|
|||
|
|
@ -642,7 +642,7 @@ const onHeaderDrop = (targetIndex) => {
|
|||
const compareTableData = ref([]);
|
||||
const diffFieldKeys = ref(new Set());
|
||||
|
||||
const getItemKey = (item) => item?.id ?? item?.uuid ?? item?.partNumber ?? "";
|
||||
const getItemKey = (item) => item?.partNumber ?? item?.id ?? item?.uuid ?? "";
|
||||
|
||||
const getDictLabel = (dictRef, value) => {
|
||||
if (!dictRef) return null;
|
||||
|
|
@ -1411,7 +1411,8 @@ const fetchSearchHints = async (keyword) => {
|
|||
? currentPart.split(":").slice(1).join(":").trim()
|
||||
: currentPart;
|
||||
const valueQueryLower = (valueQuery || "").toLowerCase();
|
||||
const apiValueSuggestions = [];
|
||||
const matchedValueSuggestions = [];
|
||||
const fallbackValueSuggestions = [];
|
||||
hintList.forEach((item) => {
|
||||
if (!Array.isArray(item.fieldValues)) return;
|
||||
const fieldKey = item.fieldKey || item.key || "";
|
||||
|
|
@ -1420,23 +1421,28 @@ const fetchSearchHints = async (keyword) => {
|
|||
const strVal =
|
||||
val === null || val === undefined ? "" : String(val).trim();
|
||||
if (!strVal) return;
|
||||
if (
|
||||
valueQueryLower &&
|
||||
!strVal.toLowerCase().includes(valueQueryLower)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
apiValueSuggestions.push({
|
||||
const matched =
|
||||
!valueQueryLower || strVal.toLowerCase().includes(valueQueryLower);
|
||||
const target = matched
|
||||
? matchedValueSuggestions
|
||||
: fallbackValueSuggestions;
|
||||
target.push({
|
||||
type: "value",
|
||||
label: strVal,
|
||||
value: strVal,
|
||||
fieldKey,
|
||||
fieldLabel,
|
||||
weight: 5, // 接口值优先展示
|
||||
weight: matched ? 5 : 3, // 匹配结果权重大,不匹配时作为兜底展示
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// 如果没有匹配到值,则使用接口返回的全部值做兜底展示
|
||||
const apiValueSuggestions =
|
||||
matchedValueSuggestions.length > 0
|
||||
? matchedValueSuggestions
|
||||
: fallbackValueSuggestions;
|
||||
|
||||
// 只用接口返回的值作为下拉建议,并去重
|
||||
const seen = new Set();
|
||||
const uniqueSuggestions = [];
|
||||
|
|
@ -1910,7 +1916,7 @@ const fetchDifferenceRecommendations = async () => {
|
|||
|
||||
const fetchCompareTable = async () => {
|
||||
const idList = selectedCompareList.value
|
||||
.map((item) => item.uuid || item.partNumber)
|
||||
.map((item) => item.partNumber)
|
||||
.filter(Boolean);
|
||||
const ids = idList.join(",");
|
||||
if (!ids) {
|
||||
|
|
|
|||