This commit is contained in:
ylj20011123 2025-11-21 09:37:53 +08:00
parent e9cd0fdb23
commit 29b67990d6
3 changed files with 301 additions and 197 deletions

BIN
src/assets/pageBg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB

View File

@ -1,44 +1,54 @@
.main{ .main {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background: #292a2d; background: #292a2d;
display: flex; display: flex;
align-items: center; align-items: center;
overflow: hidden; overflow: hidden;
.meng{ background-repeat: no-repeat;
background-size: 100% 100%;
.meng {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
position: fixed; position: fixed;
top: 0;left: 0; top: 0;
z-index:1; left: 0;
z-index: 1;
} }
.leftFilterBox{
.leftFilterBox {
width: 18vw; width: 18vw;
height: calc(100vh - 20px); height: calc(100vh - 20px);
box-sizing: border-box; box-sizing: border-box;
padding: 16px; padding: 16px;
// position: fixed; // position: fixed;
// top: 0; // top: 0;
// left: 0; // left: 0;
// overflow-y: auto; // overflow-y: auto;
.filterItem{ .filterItem {
width: 100%; width: 100%;
height: 72px; height: 72px;
margin-bottom: 18px; margin-bottom: 18px;
.topItem{
.topItem {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-bottom: 12px; margin-bottom: 12px;
.titleBox{
.titleBox {
display: flex; display: flex;
align-items: center; align-items: center;
.itemTitle{
.itemTitle {
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: #fff; color: #fff;
} }
.noticeIcon{
.noticeIcon {
width: 24px; width: 24px;
height: 24px; height: 24px;
margin-left: 4px; margin-left: 4px;
@ -47,66 +57,77 @@
} }
} }
} }
.leftFilterTabBox{
.leftFilterTabBox {
height: calc(100vh - 540px); height: calc(100vh - 540px);
.el-tabs__header{
.el-tabs__nav-wrap{ .el-tabs__header {
.el-tabs__nav-scroll{ .el-tabs__nav-wrap {
.el-tabs__nav{ .el-tabs__nav-scroll {
.el-tabs__item{ .el-tabs__nav {
.el-tabs__item {
color: #fff; color: #fff;
} }
.is-active{
.is-active {
color: #409eff; color: #409eff;
} }
} }
} }
} }
} }
.el-tabs__content{
.el-tab-pane{ .el-tabs__content {
.el-tab-pane {
height: calc(100% - 40px); height: calc(100% - 40px);
} }
} }
} }
.roleBox{ .roleBox {
height: 100%; height: 100%;
.bottomItem{
.bottomItem {
height: calc(100% - 50px); height: calc(100% - 50px);
.el-textarea{
.el-textarea {
height: 100%; height: 100%;
border-color: #292a2d!important; border-color: #292a2d !important;
.el-textarea__inner{
.el-textarea__inner {
height: 100%; height: 100%;
background-color: #292a2d; background-color: #292a2d;
border-color: #292a2d!important; border-color: #292a2d !important;
color: #fff; color: #fff;
} }
.el-textarea__inner::-webkit-scrollbar{
.el-textarea__inner::-webkit-scrollbar {
display: none; display: none;
} }
} }
} }
.updatebox{ .updatebox {
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 8px; margin-top: 8px;
.updateIcon{
.updateIcon {
width: 20px; width: 20px;
height: 20px; height: 20px;
margin-right: 6px; margin-right: 6px;
cursor: pointer; cursor: pointer;
} }
.updateText{
.updateText {
font-size: 16px; font-size: 16px;
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
} }
.updateText:hover{
.updateText:hover {
color: #358ffa; color: #358ffa;
cursor: pointer; cursor: pointer;
} }
@ -115,31 +136,34 @@
} }
} }
.leftFilterBox::-webkit-scrollbar{ .leftFilterBox::-webkit-scrollbar {
display: none; display: none;
} }
.modalSelectBox{ .modalSelectBox {
width: 10vw; width: 10vw;
height: 100vh; height: 100vh;
box-sizing: border-box; box-sizing: border-box;
padding: 16px; padding: 16px;
// position: fixed; // position: fixed;
// left: 18vw; // left: 18vw;
// top: 0; // top: 0;
.showBox{ .showBox {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
.selectBox{
.selectBox {
color: #fff; color: #fff;
} }
.indentationBox{ .indentationBox {
position: absolute; position: absolute;
top: -3px; top: -3px;
right: 0; right: 0;
.indentationIcon{
.indentationIcon {
width: 25px; width: 25px;
height: 25px; height: 25px;
cursor: pointer; cursor: pointer;
@ -168,7 +192,7 @@
// } // }
// } // }
.dialogBox{ .dialogBox {
width: 72vw; width: 72vw;
height: 100vh; height: 100vh;
box-sizing: border-box; box-sizing: border-box;
@ -176,7 +200,8 @@
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
padding-bottom: 20px; padding-bottom: 20px;
.bigContent{
.bigContent {
display: flex; display: flex;
align-items: center; align-items: center;
// width: 72vw; // width: 72vw;
@ -184,11 +209,13 @@
// max-height: calc(100vh - 98px); // max-height: calc(100vh - 98px);
// min-height: calc(100vh - 168px); // min-height: calc(100vh - 168px);
// flex: 1; // flex: 1;
height: calc(100vh - 198px); // height: calc(100vh - 198px);
height: calc(100vh - 120px);
// position: fixed; // position: fixed;
// top: 0; // top: 0;
// left: 28vw; // left: 28vw;
.contentBox{ .contentBox {
width: calc((100% - 20px) / 2); width: calc((100% - 20px) / 2);
height: 100%; height: 100%;
// height: calc(100vh - 100px); // height: calc(100vh - 100px);
@ -197,21 +224,23 @@
// left: 30vw; // left: 30vw;
box-sizing: border-box; box-sizing: border-box;
padding: 16px 16px 0; padding: 16px 16px 0;
.contentTitleBox{
.contentTitleBox {
width: 100%; width: 100%;
height: 30px; height: 30px;
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.contentTitle{
.contentTitle {
color: #fff; color: #fff;
height: 30px; height: 30px;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.phoneModalSelectBox{ .phoneModalSelectBox {
width: 120px; width: 120px;
height: 120px; height: 120px;
position: absolute; position: absolute;
@ -223,19 +252,22 @@
transform: translateY(30px); transform: translateY(30px);
border-radius: 8px; border-radius: 8px;
z-index: 2; z-index: 2;
.phoneModal{
.phoneModal {
padding: 4px; padding: 4px;
font-size: 12px; font-size: 12px;
} }
} }
.rightBox{ .rightBox {
position: relative; position: relative;
.optionIcon{
.optionIcon {
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
.phoneRightOptionBox{
.phoneRightOptionBox {
width: 150px; width: 150px;
height: 60px; height: 60px;
position: absolute; position: absolute;
@ -246,24 +278,29 @@
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
z-index: 2; z-index: 2;
.OptionItem{
.OptionItem {
width: 100%; width: 100%;
height: 72px; height: 72px;
margin-bottom: 18px; margin-bottom: 18px;
.topItem{
.topItem {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-bottom: 12px; margin-bottom: 12px;
.titleBox{
.titleBox {
display: flex; display: flex;
align-items: center; align-items: center;
.itemTitle{
.itemTitle {
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: #000; color: #000;
} }
.noticeIcon{
.noticeIcon {
width: 24px; width: 24px;
height: 24px; height: 24px;
margin-left: 4px; margin-left: 4px;
@ -275,26 +312,30 @@
} }
} }
} }
.boxContentBox{
.boxContentBox {
width: 100%; width: 100%;
height: calc(100% - 40px); height: calc(100% - 40px);
overflow-y: scroll; overflow-y: scroll;
.contentItem{ .contentItem {
width: 100%; width: 100%;
display: flex; display: flex;
.defaultItem{
.defaultItem {
box-sizing: border-box; box-sizing: border-box;
padding: 12px; padding: 12px;
margin-bottom: 12px; margin-bottom: 12px;
} }
.roleDefaultItem{
.roleDefaultItem {
max-width: 80%; max-width: 80%;
color: #f8faff; color: #f8faff;
background-color: #414158; background-color: #414158;
border-radius: 14px; border-radius: 14px;
.depthAnalysis{
.depthAnalysis {
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
@ -302,7 +343,8 @@
color: #409efe; color: #409efe;
cursor: pointer; cursor: pointer;
} }
.descText{
.descText {
color: #a6a6a6; color: #a6a6a6;
font-size: 12px; font-size: 12px;
line-height: 20px; line-height: 20px;
@ -310,10 +352,12 @@
height: 200px; height: 200px;
overflow-y: auto; overflow-y: auto;
} }
.descText::-webkit-scrollbar{
.descText::-webkit-scrollbar {
display: none; display: none;
} }
.contentText{
.contentText {
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
line-height: 28px; line-height: 28px;
@ -322,100 +366,123 @@
overflow-y: auto; overflow-y: auto;
word-break: break-all; word-break: break-all;
} }
.contentText::-webkit-scrollbar{
.contentText::-webkit-scrollbar {
display: none; display: none;
} }
} }
.assistantItem{ .assistantItem {
max-width: 80%; max-width: 80%;
.descText{
.descText {
color: #a6a6a6; color: #a6a6a6;
font-size: 12px; font-size: 12px;
line-height: 20px; line-height: 20px;
} }
.contentText{
.contentText {
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
line-height: 28px; line-height: 28px;
div { div {
line-height: 1.6; line-height: 1.6;
font-size: 16px; font-size: 16px;
strong{
strong {
color: #fff; color: #fff;
} }
} }
hr{
margin: 8px 0; hr {
} margin: 8px 0;
p{ }
strong{
p {
strong {
color: #fff; color: #fff;
} }
} }
pre{
pre {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
code{
code {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
} }
} }
h1 {
color: #fff;
strong{
color: #fff;
}
}
h2 { h1 {
color: #fff; color: #fff;
strong{
color: #fff;
}
}
h3 {
color: #fff;
strong{
color: #fff;
}
}
h4 {
color: #fff;
strong{
color: #fff;
}
}
h5 {
color: #fff;
strong{
color: #fff;
}
}
h6 {
color: #fff;
strong{
color: #fff;
}
}
strong { strong {
color: #fff;
strong{
color: #fff; color: #fff;
} }
} }
ul { h2 {
color: #fff;
strong {
color: #fff;
}
}
h3 {
color: #fff;
strong {
color: #fff;
}
}
h4 {
color: #fff;
strong {
color: #fff;
}
}
h5 {
color: #fff;
strong {
color: #fff;
}
}
h6 {
color: #fff;
strong {
color: #fff;
}
}
strong {
color: #fff;
strong {
color: #fff;
}
}
ul {
padding-left: 20px; padding-left: 20px;
strong{
strong {
color: #fff; color: #fff;
} }
} }
ol{
box-sizing: border-box; ol {
padding: 0 5px; box-sizing: border-box;
padding: 0 5px;
// li { // li {
// margin-bottom: 5px; // margin-bottom: 5px;
// box-sizing: border-box; // box-sizing: border-box;
@ -434,29 +501,32 @@
// text-align-last: center!important; // text-align-last: center!important;
// font-variant-numeric: normal!important; // font-variant-numeric: normal!important;
// } // }
} }
li { li {
margin-bottom: 5px; margin-bottom: 5px;
box-sizing: border-box; box-sizing: border-box;
strong{
strong {
color: #fff; color: #fff;
} }
} }
table{
thead{ table {
tr{ thead {
th{ tr {
strong{ th {
strong {
color: #fff; color: #fff;
} }
} }
} }
} }
} }
} }
} }
.userItem{
.userItem {
color: #f8faff; color: #f8faff;
// background-color: #414158; // background-color: #414158;
width: 80%; width: 80%;
@ -465,10 +535,12 @@
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
.reloadBox{
.reloadBox {
display: none; display: none;
} }
.userText{
.userText {
background-color: #414158; background-color: #414158;
max-width: 100%; max-width: 100%;
color: #f8faff; color: #f8faff;
@ -478,10 +550,12 @@
display: inline-block; display: inline-block;
} }
} }
.userItem:hover{
.reloadBox{ .userItem:hover {
.reloadBox {
display: block; display: block;
.img{
.img {
width: 30px; width: 30px;
height: 30px; height: 30px;
margin-right: 12px; margin-right: 12px;
@ -491,8 +565,8 @@
} }
.loading{ .loading {
.loadingTextBox{ .loadingTextBox {
padding: 12px; padding: 12px;
border-radius: 14px; border-radius: 14px;
background: #494949; background: #494949;
@ -501,18 +575,21 @@
line-height: 20px; line-height: 20px;
margin-bottom: 12px; margin-bottom: 12px;
} }
.loadingBox{
.loadingBox {
display: block; display: block;
width: 20px; width: 20px;
height: 20px; height: 20px;
font-size: 20px; font-size: 20px;
.el-loading-mask{
background: transparent!important; .el-loading-mask {
.el-loading-spinner{ background: transparent !important;
.circular{
font-size: 20px!important; .el-loading-spinner {
width: 20px!important; .circular {
height: 20px!important; font-size: 20px !important;
width: 20px !important;
height: 20px !important;
} }
} }
} }
@ -520,40 +597,45 @@
} }
} }
.contentImgBox{ .contentImgBox {
width: 100%; width: 100%;
height: 200px; height: 200px;
display: flex; display: flex;
justify-content: center; justify-content: center;
.contentImg{
.contentImg {
width: 200px; width: 200px;
height: 200px; height: 200px;
} }
} }
.toolBox{ .toolBox {
width: 80%; width: 80%;
display: flex; display: flex;
align-items: center; align-items: center;
// justify-content: center; // justify-content: center;
justify-content: flex-end; justify-content: flex-end;
.deleteBox{
.deleteBox {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.deleteIcon{
.deleteIcon {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin-right: 8px; margin-right: 8px;
cursor: pointer; cursor: pointer;
} }
.deleteText{
.deleteText {
font-size: 14px; font-size: 14px;
// color: #fff; // color: #fff;
color: #a6a6a6; color: #a6a6a6;
cursor: pointer; cursor: pointer;
} }
.deleteText:hover{
.deleteText:hover {
color: #358ffa; color: #358ffa;
} }
} }
@ -561,7 +643,8 @@
} }
.boxContentBox::-webkit-scrollbar{
.boxContentBox::-webkit-scrollbar {
display: none; display: none;
} }
} }
@ -569,7 +652,7 @@
} }
.inputBox{ .inputBox {
width: 50vw; width: 50vw;
max-height: 168px; max-height: 168px;
min-height: 98px; min-height: 98px;
@ -584,18 +667,19 @@
border-radius: 16px; border-radius: 16px;
background-color: #404045; background-color: #404045;
.showBox{ .showBox {
width: 100px; width: 100px;
height: 100%; height: 100%;
margin-right: 10px; margin-right: 10px;
display: flex; display: flex;
align-items: center; align-items: center;
.selectBox{
.selectBox {
color: #fff; color: #fff;
} }
} }
.input{ .input {
width: 100%; width: 100%;
// width: calc(100% - 200px); // width: calc(100% - 200px);
// height: 50px; // height: 50px;
@ -604,19 +688,21 @@
border-width: 0; border-width: 0;
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
.el-textarea__inner{
.el-textarea__inner {
// border-radius: 32px; // border-radius: 32px;
padding: 1px 16px; padding: 1px 16px;
background-color: #404045; background-color: #404045;
color: #fff; color: #fff;
box-shadow: none; box-shadow: none;
} }
.el-textarea__inner::-webkit-scrollbar{
.el-textarea__inner::-webkit-scrollbar {
display: none; display: none;
} }
} }
.bottomInput{ .bottomInput {
width: 100%; width: 100%;
height: 60px; height: 60px;
box-sizing: border-box; box-sizing: border-box;
@ -624,10 +710,12 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.leftBox{
.leftBox {
display: flex; display: flex;
align-items: center; align-items: center;
.handleV3{
.handleV3 {
font-size: 14px; font-size: 14px;
color: #F8FAFF; color: #F8FAFF;
padding: 4px 8px; padding: 4px 8px;
@ -636,14 +724,17 @@
cursor: pointer; cursor: pointer;
margin-right: 8px; margin-right: 8px;
} }
.handleV3Select{
.handleV3Select {
color: #559de9; color: #559de9;
border: 1px solid #559de9; border: 1px solid #559de9;
background-color: #48518e; background-color: #48518e;
} }
.changeBigBox{
.changeBigBox {
position: relative; position: relative;
.phoneChangeBox{
.phoneChangeBox {
font-size: 14px; font-size: 14px;
color: #F8FAFF; color: #F8FAFF;
padding: 4px 8px; padding: 4px 8px;
@ -651,7 +742,8 @@
border: 1px solid #F8FAFF; border: 1px solid #F8FAFF;
cursor: pointer; cursor: pointer;
} }
.phoneModalSelectBox{
.phoneModalSelectBox {
width: 120px; width: 120px;
height: 120px; height: 120px;
position: absolute; position: absolute;
@ -663,7 +755,8 @@
transform: translateY(-120px); transform: translateY(-120px);
border-radius: 8px; border-radius: 8px;
z-index: 2; z-index: 2;
.phoneModal{
.phoneModal {
padding: 4px; padding: 4px;
font-size: 12px; font-size: 12px;
} }
@ -671,16 +764,18 @@
} }
} }
.sendBox{
.sendBox {
cursor: pointer; cursor: pointer;
.iconImg{
.iconImg {
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
} }
} }
.btn{ .btn {
width: 70px; width: 70px;
height: 100%; height: 100%;
margin-left: 10px; margin-left: 10px;
@ -691,18 +786,20 @@
color: #fff; color: #fff;
} }
.stopBox{ .stopBox {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-left: 12px; margin-left: 12px;
cursor: pointer; cursor: pointer;
.stopIcon{
.stopIcon {
width: 26px; width: 26px;
height: 26px; height: 26px;
margin-right: 12px; margin-right: 12px;
} }
.stopText{
.stopText {
color: #fff; color: #fff;
} }
} }
@ -713,16 +810,18 @@
} }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.main{ .main {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background: #292a2d; background: #292a2d;
display: flex; display: flex;
align-items: center; align-items: center;
.leftFilterBox{
.leftFilterBox {
display: none; display: none;
} }
.modalSelectBox{
.modalSelectBox {
display: none; display: none;
} }
} }

View File

@ -16,6 +16,7 @@ import {
handleSynchroPROMPT, handleSynchroPROMPT,
} from "./service"; } from "./service";
import moment from "moment"; import moment from "moment";
import pageBg from '../../assets/pageBg.png'
@ -151,15 +152,17 @@ onMounted(async () => {
isPhone.value = true; isPhone.value = true;
// //
modalTypeSelect.value = [4]; modalTypeSelect.value = [4];
if (modalTypeDataList && modalTypeDataList.length > 0) { }
modalTypeDataList.forEach((item: any) => { console.log('modalTypeDataListmodalTypeDataList', modalTypeDataList);
if (modalTypeSelect.value.indexOf(item.value) !== -1) {
item.isShow = true; if (modalTypeDataList && modalTypeDataList.length > 0) {
} else { modalTypeDataList.forEach((item: any) => {
item.isShow = false; if (modalTypeSelect.value.indexOf(item.value) !== -1) {
} item.isShow = true;
}); } else {
} item.isShow = false;
}
});
} else { } else {
const urlParams = new URLSearchParams(window.location.search); const urlParams = new URLSearchParams(window.location.search);
param1 = urlParams.get('comeForm') || ""; param1 = urlParams.get('comeForm') || "";
@ -216,9 +219,9 @@ onMounted(async () => {
} }
// //
if (param1 === 'YNMap') { // if (param1 === 'YNMap') {
routerRole.value.content = "" // routerRole.value.content = ""
} // }
console.log("YSRole", YSRole); console.log("YSRole", YSRole);
console.log("routerRole", routerRole); console.log("routerRole", routerRole);
@ -557,9 +560,10 @@ const handleSendRequest = async (bigObj?: any) => {
await handleAskDirectlyDeepseek(); await handleAskDirectlyDeepseek();
return; return;
} }
console.log('pageType.valuepageType.value', pageType.value);
// //
if (pageType.value === 1 && containsDaping(thisQuestion)) { if (containsDaping(thisQuestion)) {
// //
// //
@ -1976,6 +1980,7 @@ const handleGetYNMapData = async () => {
"服务区承载": sessionStorage.getItem("OverviewOfServiceAreaBusinessAI") || "", "服务区承载": sessionStorage.getItem("OverviewOfServiceAreaBusinessAI") || "",
"特情事件": sessionStorage.getItem("TradingAlertAI") || "", "特情事件": sessionStorage.getItem("TradingAlertAI") || "",
"实时营收": sessionStorage.getItem("CoreBusinessDataAI") || "", "实时营收": sessionStorage.getItem("CoreBusinessDataAI") || "",
"月度实时数据": sessionStorage.getItem("CoreBusinessDataMonthAI") || "",
"断面流量": sessionStorage.getItem("TrendOfTrafficFlowYesAI") || "", "断面流量": sessionStorage.getItem("TrendOfTrafficFlowYesAI") || "",
"入区车流": sessionStorage.getItem("VehiclesEnteringAI") || "", "入区车流": sessionStorage.getItem("VehiclesEnteringAI") || "",
"对客营收": sessionStorage.getItem("VehiclesEnteringAI2") || "", "对客营收": sessionStorage.getItem("VehiclesEnteringAI2") || "",
@ -2766,7 +2771,7 @@ const handleChangeProcess = (e: any) => {
</script> </script>
<template> <template>
<div class="main"> <div class="main" :style="{ backgroundImage: pageType === 1 ? `url(${pageBg})` : '' }">
<div class="meng" v-if="showPhoneChange || showPhoneOption" @click="handleClosePhoneMeng"></div> <div class="meng" v-if="showPhoneChange || showPhoneOption" @click="handleClosePhoneMeng"></div>
<div class="leftFilterBox" v-if="hideLeft" :style="{ width: pageType === 1 ? '350px' : '' }"> <div class="leftFilterBox" v-if="hideLeft" :style="{ width: pageType === 1 ? '350px' : '' }">