-
-

+
+
-
-

-
+
2.5D图
+
+
-
+
diff --git a/src/app/routes/data-v/second1/second1.component.less b/src/app/routes/data-v/second1/second1.component.less
index 6a37aab..fd7cdbf 100644
--- a/src/app/routes/data-v/second1/second1.component.less
+++ b/src/app/routes/data-v/second1/second1.component.less
@@ -219,6 +219,9 @@
display: flex;
flex-direction: column;
width: 100%;
+ height: 100%;
+ margin: 1vw;
+ margin-top: 10px;
background-image: url("/assets/car-status-bg.png");
background-repeat: no-repeat;
background-position: center;
@@ -232,17 +235,21 @@
margin-bottom: 20px; /* 每行之间的间距 */
}
- .image-container {
- display: flex;
- flex: 1; /* 三个子元素均匀分布 */
- align-items: center; /* 图片居中 */
- justify-content: center; /* 图片居中 */
- margin: 0 10px; /* 子组件之间的间距 */
+ .item {
+ flex-basis: 100px;
+ flex-grow: 1;
+ margin: 10px;
+ margin-top: 20px;
+ }
+
+ .item:nth-child{
+ flex-grow: 6;
}
- .image-container img {
- max-width: 100%;
- max-height: 100%;
+ .item img {
+ width: 200px;
+ height: 200px;
+ margin: 10px;
object-fit: contain; /* 保持图片的宽高比 */
}
@@ -272,4 +279,19 @@
border-radius: 5px;
box-shadow: 0 2px 4px rgb(0 0 0 / 10%);
}
-
\ No newline at end of file
+
+ [nz-carousel-content] {
+ overflow: hidden;
+ width: 150px; /* 调整宽度 */
+ height: 80px; /* 调整高度 */
+ color: #fff;
+ text-align: center;
+ background: #364d79;
+ }
+
+
+ h3 {
+ user-select: none;
+ margin-bottom: 0;
+ color: #fff;
+ }
\ No newline at end of file
diff --git a/src/app/routes/data-v/second1/second1.component.ts b/src/app/routes/data-v/second1/second1.component.ts
index 16f9fc4..9319b24 100644
--- a/src/app/routes/data-v/second1/second1.component.ts
+++ b/src/app/routes/data-v/second1/second1.component.ts
@@ -5,6 +5,7 @@ import { SHARED_IMPORTS } from '@shared';
import { AgGridAngular } from 'ag-grid-angular';
import { ColDef, GridApi } from 'ag-grid-community';
import * as echarts from 'echarts';
+import { NzCarouselModule } from 'ng-zorro-antd/carousel';
import { NzPaginationModule } from 'ng-zorro-antd/pagination';
import { MqttService } from 'ngx-mqtt';
@@ -22,6 +23,7 @@ import { LjAgGridComponentComponent } from '../workstation/lj-ag-grid-component/
templateUrl: './second1.component.html',
styleUrls: ['./second1.component.less'],
imports: [
+ NzCarouselModule,
DataVT1Component,
DataVLjCarInfoTableComponent,
AgGridAngular,
@@ -43,7 +45,7 @@ export class DataVSecond1Component implements OnInit {
private readonly modal = inject(ModalHelper);
private readonly elementRef = inject(ElementRef);
private readonly titleService = inject(TitleService);
- public items = [1];
+ public items = [1, 2, 3, 4];
public chartDom = document.getElementById('main')!;
// public myChart = echarts.init(this.chartDom);
@@ -59,7 +61,8 @@ export class DataVSecond1Component implements OnInit {
//多模拟几行数据出来
rowData: object[] = [];
-
+ array = [1, 2, 3, 4];
+ effect = 'scrollx';
colDefs1: ColDef[] = [
{ headerName: '任务描述', unSortIcon: true, field: 'rwms', width: 120 },
{ headerName: '开始时间', headerClass: 'ag-header-center', unSortIcon: true, field: 'kssj', width: 180 },
diff --git a/src/assets/car0.jpg b/src/assets/car0.jpg
new file mode 100644
index 0000000..4febeea
Binary files /dev/null and b/src/assets/car0.jpg differ