diff --git a/src/api/goods.js b/src/api/goods.js index c5b24f2..5888d0a 100644 --- a/src/api/goods.js +++ b/src/api/goods.js @@ -95,14 +95,7 @@ export function getSmallCount(params) { params, }); } -// 切换语言 -export function getLanguages(params) { - return request({ - url: "/system/pub/enums/get-languages", - method: "get", - params, - }); -} + // 菜单权限 export function menuList(params) { return request({ diff --git a/src/components/HeaderTop.vue b/src/components/HeaderTop.vue index a62d650..6b68e3c 100644 --- a/src/components/HeaderTop.vue +++ b/src/components/HeaderTop.vue @@ -294,7 +294,6 @@ export default { }, created() { this.getSpecialArea(); - this.getLanguages(); this.getMenuList(); this.getIndexMailCount(); }, @@ -400,30 +399,7 @@ export default { this.userInfo.memberCode; window.open(src, "_blank"); }, - getLanguages() { - api.getLanguages().then((res) => { - if (res.code == 200) { - res.data.forEach((item) => { - if (item.field == localStorage.getItem("lang")) { - this.selLabl = item.label; - } - }); - if ( - localStorage.getItem("lang") == undefined || - localStorage.getItem("lang") == "undefined" - ) { - localStorage.setItem("lang", "zh-CN"); - } - this.languageList = res.data; - } - }); - }, - setLanguage(item) { - localStorage.setItem("lang", item.field); - this.selLabl = item.label; - this.$i18n.locale = item.field; - location.reload(); - }, + goPersonInfo(index) { this.$router.push({ path: "/personal", diff --git a/src/views/index/components/sidebarUserInfo.vue b/src/views/index/components/sidebarUserInfo.vue index 77ee78e..7039a29 100644 --- a/src/views/index/components/sidebarUserInfo.vue +++ b/src/views/index/components/sidebarUserInfo.vue @@ -52,6 +52,21 @@
+ +
+ 当前距离 + + {{ awards.tarAwardsName }} + + 奖衔,小区仅需 + + {{ sprintProgress.gapText }} + +
+
@@ -137,6 +152,23 @@
+ +
+
奖衔冲刺
+
+
+
+ 已完成 {{ sprintProgress.actualAchievedText }} / 目标 + {{ sprintProgress.targetText }} +
+
+
@@ -174,6 +206,62 @@ export default { return user; }, ...mapGetters(["userInfo"]), + sprintProgress() { + const awardsData = this.awards || {}; // Handle case where awards might be null/undefined initially + const targetPvStr = awardsData.targetPv; + const sumRealPvStr = awardsData.sumRealPv; // User comment: 这是"小区仅需"的量,即差距 + + if ( + typeof targetPvStr === "undefined" || + typeof sumRealPvStr === "undefined" + ) { + return { + percentageString: "0%", + actualAchievedText: "0.00", + targetText: "0.00", + gapText: "0.00", + }; + } + + const targetPv = parseFloat(targetPvStr); + const gapPv = parseFloat(sumRealPvStr); // sumRealPv is the gap + + let actualAchievedPv = 0; + let percentage = 0; + const numericTargetPv = Math.max(0, isNaN(targetPv) ? 0 : targetPv); + + if (numericTargetPv > 0) { + actualAchievedPv = + numericTargetPv - (isNaN(gapPv) ? numericTargetPv : gapPv); + actualAchievedPv = Math.max(0, actualAchievedPv); + actualAchievedPv = Math.min(actualAchievedPv, numericTargetPv); + percentage = (actualAchievedPv / numericTargetPv) * 100; + } else if (numericTargetPv === 0) { + if (!isNaN(gapPv) && gapPv <= 0) { + actualAchievedPv = 0; + percentage = 100; + } else { + actualAchievedPv = 0; + percentage = 0; + } + } + + const clampedPercentage = Math.min( + 100, + Math.max(0, isNaN(percentage) ? 0 : percentage) + ); + + return { + percentageString: `${Math.floor(clampedPercentage)}%`, + actualAchievedText: (Math.floor(actualAchievedPv * 100) / 100).toFixed( + 2 + ), + targetText: numericTargetPv.toFixed(2), + gapText: (Math.floor((isNaN(gapPv) ? 0 : gapPv) * 100) / 100).toFixed( + 2 + ), + }; + }, }, data() { return { @@ -319,8 +407,8 @@ export default { width: 380px; box-sizing: border-box; padding: 20px; - background: #ffffff; - box-shadow: 5px 5px 20px 0px rgba(233, 233, 233, 0.5); + background: #f4f8fb; + box-shadow: 5px 5px 20px 0px rgba(0, 76, 140, 0.2); border-radius: 10px 10px 10px 10px; opacity: 1; margin-right: 20px; @@ -345,8 +433,8 @@ export default { font-size: 22px; margin-right: 12px; font-weight: bold; - color: #b8860b; - text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15); + color: #005bac; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); } } .user-level-info { @@ -359,7 +447,7 @@ export default { } .create-time { margin: 10px auto 10px auto; - color: #666; + color: #004c8c; font-size: 14px; text-align: center; } @@ -368,19 +456,18 @@ export default { padding: 0 40px; line-height: 40px; font-size: 14px; - color: #666; + color: #004c8c; justify-content: center; .margin-s { margin: 0 10px; } .divs { padding: 0 10px; - //width: 40px; height: 40px; border-radius: 8px 8px 8px 8px; opacity: 1; - border: 1px solid #979797; - color: var(--primary-color); + border: 1px solid #b3d1ee; + color: #005bac; font-size: 18px; text-align: center; line-height: 40px; @@ -391,18 +478,14 @@ export default { width: 100%; margin: 0 auto; margin-top: 10px; - background: url("~@/assets/images/id-card-bg.png") no-repeat; - background-size: 100% 100%; - //background: linear-gradient(180deg, #f8d869 0%, #f48b1f 100%); + background-image: linear-gradient(180deg, #005bac 0%, #003f8c 100%); border-radius: 10px; position: relative; .user-cards { cursor: pointer; - padding: 16px 10px; - // position: absolute; + padding: 0px 10px 16px; z-index: 1; - // display: flex; .user-card-bg { position: absolute; right: 0; @@ -419,20 +502,15 @@ export default { border-radius: 10px; margin: 5px; position: relative; - overflow: hidden; // Hide overflowing parts of bars + overflow: hidden; } .progress-bar-container.no-value { - background: rgba( - 255, - 255, - 255, - 0.3 - ); // Transparent background when no values + background: rgba(255, 255, 255, 0.1); } .progress-bar-container.has-value { - background: #fff; // White background when has values + background: rgba(255, 255, 255, 0.2); } .left-bar { @@ -440,33 +518,32 @@ export default { left: 0; top: 0; height: 100%; - background: #fea43c; // Left bar color - border-radius: 10px 0 0 10px; // Rounded left corners - z-index: 1; // Below text + background: #28a2ff; + border-radius: 10px 0 0 10px; + z-index: 1; } .right-bar { position: absolute; - right: 0; // Align to the right + right: 0; top: 0; height: 100%; - background: #409eff; // Right bar color (changed to blue) - border-radius: 0 10px 10px 0; // Rounded right corners - z-index: 1; // Below text + background-color: #87cefa; + border-radius: 0 10px 10px 0; + z-index: 1; } - // Remove old schedule styles if they exist .schedule, .schedule1 { - display: none; // Hide old elements if necessary, or remove them fully + display: none; } .current-schedule { - display: none; // Hide old elements if necessary, or remove them fully + display: none; } .progress-wrapper { display: flex; align-items: center; - margin-top: 5px; + margin-top: 8px; } .progress-wrapper:first-child { margin-top: 0px; @@ -474,7 +551,9 @@ export default { .progress-wrapper__label { margin-right: 10px; font-size: 12px; - color: #fff; + color: #b3d1ee; + width: 60px; + text-align: right; } .cha { position: absolute; @@ -483,8 +562,9 @@ export default { transform: translate(-50%, -50%); font-size: 12px; white-space: nowrap; - color: #fff; // Ensure text is readable (changed to white) - z-index: 2; // Above the bars + color: #002244; + text-shadow: none; + z-index: 2; } .state { font-size: 10px; @@ -513,70 +593,152 @@ export default { .honor-title-wrapper { flex: 1; > div:first-child { - color: #757575; // Slightly muted color for the label - margin-bottom: 2px; // Add some space between label and value + color: #003366; + margin-bottom: 2px; } } .honor-title { - font-weight: 700; // Bolder - font-size: 20px; // Larger font size - color: #333; // Darker color for prominence + font-weight: 700; + font-size: 20px; + color: #002244; + text-shadow: 0 0 7px rgba(227, 173, 170, 0.5), + 0 0 12px rgba(227, 173, 170, 0.3); } .honor-title.is-empty-awards { font-weight: normal; - font-size: 18px; // Slightly smaller or same as original - color: #999; // Muted grey color - // font-style: italic; // Optional: if italics are desired + font-size: 18px; + color: #7986cb; + text-shadow: none; } } } .authority-badge { display: inline-block; - position: relative; // Needed for pseudo-element positioning + position: relative; padding: 4px 10px; - font-size: 13px; // Slightly increased font size + font-size: 13px; font-weight: bold; - color: #4a3b31; // Dark brown text color for better contrast - background: linear-gradient( - 135deg, - #ffd700, - #ffa500 - ); // Gold to Orange gradient + color: #4a3b31; + background: linear-gradient(135deg, #ffd700, #ffa500); border-radius: 12px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); line-height: normal; - overflow: hidden; // Keep the shine effect contained - cursor: default; // Optional: change cursor to indicate it's not a button + overflow: hidden; + cursor: default; } .authority-badge::before { content: ""; position: absolute; top: 0; - left: -120%; // Adjusted to ensure the wider shine starts fully off-screen - width: 50%; // Width of the shine + left: -120%; + width: 50%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.6), - // Increased opacity for a more prominent shine transparent ); - transform: skewX(-25deg); // Angled shine - animation: shine 2.5s infinite 1s; // Animation name, duration, iteration, delay + transform: skewX(-25deg); + animation: shine 2.5s infinite 1s; } @keyframes shine { 0% { - left: -120%; // Adjusted to ensure the wider shine starts fully off-screen + left: -120%; } 50% { - left: 120%; // Move across the badge + left: 120%; } 100% { - left: 120%; // Stay off-screen to the right before resetting + left: 120%; } } + +.awards-progress-summary { + text-align: center; + padding: 10px 0 15px 0; + .descriptive-text { + font-size: 12px; + color: #e0e0e0; + opacity: 1; + margin-right: 4px; + } + + .highlight-name, + .highlight-pv { + font-size: 16px; + font-weight: bold; + padding: 0 3px; + margin: 0 1px; + display: inline-block; + color: #ffffff; + text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); + } +} + +.sprint-progress-container { + flex: 1; + height: 16px; + background: rgba(255, 255, 255, 0.3); + border-radius: 10px; + position: relative; + overflow: hidden; +} + +.sprint-current-progress { + position: absolute; + left: 0; + top: 0; + height: 100%; + border-radius: 10px; + background: linear-gradient(135deg, #1e90ff 0%, #4169e1 100%); + transition: width 0.6s ease-in-out; + box-shadow: none; + overflow: hidden; +} + +.sprint-current-progress::before { + content: ""; + position: absolute; + top: 0; + left: -100%; + width: 80%; + height: 100%; + background: linear-gradient( + 90deg, + rgba(255, 255, 255, 0) 0%, + rgba(255, 255, 255, 0.3) 50%, + rgba(255, 255, 255, 0) 100% + ); + transform: skewX(-25deg); + animation: sweepingShimmer 2s infinite linear; + border-radius: inherit; +} + +@keyframes sweepingShimmer { + 0% { + left: -100%; + } + 100% { + left: 120%; + } +} + +.sprint-progress-text { + width: 100%; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + white-space: nowrap; + text-align: center; + font-size: 10px; + color: #ffffff; + font-weight: bold; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); + z-index: 2; +}