| | |
|---|
| | | <!-- |
|---|
| | | * @Date: 2024-10-05 09:51:45 |
|---|
| | | * @LastEditors: gaoshp |
|---|
| | | * @LastEditTime: 2024-10-07 00:32:44 |
|---|
| | | * @LastEditTime: 2024-10-07 09:51:11 |
|---|
| | | * @FilePath: /cps-web/src/views/console/workstation/CollTable.vue |
|---|
| | | --> |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <el-table :data="tabledata" height="200px"> |
|---|
| | | <el-table-column v-for="item in cols" :key="item.prop" :prop="item.prop" :label="item.label" width="120"> |
|---|
| | | <template #header="scope"> |
|---|
| | | <span v-show="item.isRequired" style="color: red;">*</span> |
|---|
| | | <span>{{ scope.column.label }}</span> |
|---|
| | | <el-tooltip class="box-item" effect="dark" placement="top-start"> |
|---|
| | | <template #content> |
|---|
| | | <p v-html="item.describe"></p> |
|---|
| | | </template> |
|---|
| | | <el-icon v-show="item.describe"><el-icon-question-filled /></el-icon> |
|---|
| | | </el-tooltip> |
|---|
| | | |
|---|
| | | </template> |
|---|
| | | <template #default="scope"> |
|---|
| | | <span>{{ scope.row[item.prop] }}</span> |
|---|
| | | <el-select disabled v-model="scope.row[item.prop]" placeholder="" size="small" |
|---|
| | | v-if="item.type === 'option'"> |
|---|
| | | <el-option v-for="item in item.options" :key="item" :label="item" :value="item" /> |
|---|
| | | </el-select> |
|---|
| | | <el-switch disabled size="small" v-model="scope.row[item.prop]" |
|---|
| | | v-else-if="item.type === 'boolean'" /> |
|---|
| | | <span v-else>{{ scope.row[item.prop] }}</span> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
