mirror of
http://112.124.100.131/ebiz-ai/ebiz-base-ai.git
synced 2025-12-06 09:26:48 +08:00
feat(comparison): 添加产品对比页面的增加产品功能
- 在表格的行标题列添加增加产品的按钮 - 实现按钮点击时更新 showComparison 属性,关闭对比页面 - 优化表格样式,调整列宽和添加圆角样式
This commit is contained in:
@@ -42,7 +42,7 @@
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<comparsion :list="comparisonMap"></comparsion>
|
||||
<comparsion :list="comparisonMap" :showComparison.sync="showComparison"></comparsion>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -2,10 +2,14 @@
|
||||
<div style="touch-action: unset" class="comparsion-container">
|
||||
<el-table :data="tableData" style="width: 100%" border :height="getTableHeight()">
|
||||
<!-- 左侧行标题 -->
|
||||
<el-table-column fixed prop="rowTitle" label="指标" width="100"></el-table-column>
|
||||
<el-table-column fixed prop="rowTitle" width="100">
|
||||
<template slot="header" slot-scope="scope">
|
||||
<button class="header-button" @click="emits">+ 增加产品</button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- 动态列:根据 list 生成 -->
|
||||
<el-table-column v-for="(item, index) in list" :key="index" :label="item.title" width="150">
|
||||
<el-table-column v-for="(item, index) in list" :key="index" :label="item.title" width="200">
|
||||
<template #default="scope">
|
||||
<!-- 根据 item.id 映射对应的字段名,比如 b1、b2、b3 等 -->
|
||||
{{ formatValue(scope.row[item.id]) }}
|
||||
@@ -19,6 +23,10 @@ import { compare } from '@/api/generatedApi'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
showComparison: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
@@ -41,6 +49,10 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
emits() {
|
||||
console.log(123)
|
||||
this.$emit('update:showComparison', false)
|
||||
},
|
||||
getCompare() {
|
||||
let ids = this.list.map((item) => {
|
||||
return item.id
|
||||
@@ -88,9 +100,17 @@ export default {
|
||||
.comparsion-container {
|
||||
height: calc(100vh - 20px);
|
||||
padding: 10px;
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.header-button {
|
||||
background: transparent;
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
::v-deep .el-table {
|
||||
border-radius: 8px;
|
||||
& th {
|
||||
&.el-table__cell {
|
||||
background: #1989fa;
|
||||
|
||||
Reference in New Issue
Block a user