|
|
@ -1,219 +1,134 @@ |
|
|
|
<!-- 附件组件 --> |
|
|
|
<template> |
|
|
|
<div class="table-form"> |
|
|
|
<el-table |
|
|
|
class="multipleTableComponents" |
|
|
|
ref="TableBaseComponents_Ref" |
|
|
|
v-loading="tableLoading" |
|
|
|
:data="tableData" |
|
|
|
:height="height" |
|
|
|
row-key="id" |
|
|
|
:border="border" |
|
|
|
@selection-change="tableSelectionChange" |
|
|
|
@sort-change="tableSortChange" |
|
|
|
@row-click="handleTableSelect" |
|
|
|
> |
|
|
|
<el-table class="multipleTableComponents" ref="TableBaseComponents_Ref" v-loading="tableLoading" :data="tableData" |
|
|
|
max-height="maxHeight" row-key="id" :border="border" @selection-change="tableSelectionChange" |
|
|
|
@sort-change="tableSortChange" @row-click="handleTableSelect"> |
|
|
|
<!-- 删除按钮 --> |
|
|
|
<el-table-column fixed="left" :width="50" v-if="isShowButton" v-slot="{ row, $index }"> |
|
|
|
<Icon icon="ep:remove" color="#409eff" size="26" style="cursor: pointer;margin-top: -16px;" @click="handleDelete(row, $index)" /> |
|
|
|
</el-table-column> |
|
|
|
<!-- 多选 --> |
|
|
|
<el-table-column |
|
|
|
fixed="left" |
|
|
|
:reserve-selection="true" |
|
|
|
type="selection" |
|
|
|
:width="50" |
|
|
|
v-if="selectionTable" |
|
|
|
/> |
|
|
|
<el-table-column fixed="left" :reserve-selection="true" type="selection" :width="50" v-if="selectionTable" /> |
|
|
|
<!-- 序号 --> |
|
|
|
<el-table-column |
|
|
|
type="index" |
|
|
|
fixed="left" |
|
|
|
label="序号" |
|
|
|
width="80" |
|
|
|
:align="'center'" |
|
|
|
v-if="isShowIndex" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
v-slot="{ row }" |
|
|
|
v-for="headerItem in tableFields" |
|
|
|
:key="headerItem" |
|
|
|
:fixed="headerItem.tableForm?.fixed" |
|
|
|
:label="headerItem.label" |
|
|
|
:prop="headerItem.field" |
|
|
|
:align="headerItem?.tableForm?.align || 'left'" |
|
|
|
:sortable="headerItem?.tableForm?.sortable || ''" |
|
|
|
:width="headerItem?.tableForm?.width || 'auto'" |
|
|
|
> |
|
|
|
<el-form |
|
|
|
ref="TableBaseForm_Ref" |
|
|
|
:model="row" |
|
|
|
> |
|
|
|
<el-table-column type="index" fixed="left" label="序号" width="80" :align="'center'" v-if="isShowIndex" /> |
|
|
|
<el-table-column v-slot="{ row }" v-for="headerItem in tableFields" :key="headerItem" |
|
|
|
:fixed="headerItem.tableForm?.fixed" :label="headerItem.label" :prop="headerItem.field" |
|
|
|
:align="headerItem?.tableForm?.align || 'center'" :sortable="headerItem?.tableForm?.sortable || ''" |
|
|
|
:width="headerItem?.tableForm?.width || 'auto'" :min-width="headerItem?.tableForm?.minWidth || 'auto'"> |
|
|
|
<el-form ref="TableBaseForm_Ref" :model="row" style="width: 100%;" :rules="tableFormRules" |
|
|
|
:class="tableFormRules ? '' : 'noRulesForm'"> |
|
|
|
<!-- 字符串输入框 --> |
|
|
|
<el-form-item v-if="!headerItem?.tableForm?.type || headerItem?.tableForm?.type == 'InputString'" :prop="headerItem.field"> |
|
|
|
<el-input |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
<el-form-item v-if="!headerItem?.tableForm?.type || headerItem?.tableForm?.type == 'InputString'" |
|
|
|
:prop="headerItem.field"> |
|
|
|
<el-input v-model="row[headerItem.field]" |
|
|
|
:placeholder="headerItem?.tableForm?.placeholder || '请输入' + headerItem.label" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
/> |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" style="width: 100%;" /> |
|
|
|
</el-form-item> |
|
|
|
<!-- 数字输入框 --> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'InputNumber'" :prop="headerItem.field"> |
|
|
|
<el-input-number |
|
|
|
style="width: 100%;" |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:max="headerItem?.tableForm?.max" |
|
|
|
:min="headerItem?.tableForm?.min" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
/> |
|
|
|
<el-input-number style="width: 100%;" v-model="row[headerItem.field]" :max="headerItem?.tableForm?.max" |
|
|
|
:min="headerItem?.tableForm?.min" :disabled="itemIsDisabled(headerItem, row)" /> |
|
|
|
</el-form-item> |
|
|
|
<!-- 下拉框 --> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'Select'" :prop="headerItem.field"> |
|
|
|
<el-select |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:clearable="headerItem?.tableForm.clearable" |
|
|
|
:multiple="headerItem?.tableForm.multiple" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:filterable="headerItem?.tableForm.filterable" |
|
|
|
:allow-create="headerItem?.tableForm.allowCreate" |
|
|
|
style="width: 100%" |
|
|
|
:placeholder="headerItem?.tableForm?.placeholder || '请选择' + headerItem.label" |
|
|
|
@change="formSelectChange(row[headerItem.field], $event)" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="op in initSelectOptions(headerItem)" |
|
|
|
:label="op.label" |
|
|
|
:value="op.value" |
|
|
|
:key="op.value" |
|
|
|
/> |
|
|
|
<el-select v-model="row[headerItem.field]" :clearable="headerItem?.tableForm.clearable" |
|
|
|
:multiple="headerItem?.tableForm.multiple" :disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:filterable="headerItem?.tableForm.filterable" :allow-create="headerItem?.tableForm.allowCreate" |
|
|
|
style="width: 100%" :placeholder="headerItem?.tableForm?.placeholder || '请选择' + headerItem.label" |
|
|
|
@change="formSelectChange(row[headerItem.field], $event)"> |
|
|
|
<el-option v-for="op in initSelectOptions(headerItem)" :label="op.label" :value="op.value" |
|
|
|
:key="op.value" /> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<!-- 时间选择器 --> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'FormTime'" :prop="headerItem.field"> |
|
|
|
<el-time-picker |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:placeholder="headerItem?.tableForm?.placeholder || '选择时间'" |
|
|
|
style="width: 100%" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
<el-time-picker v-model="row[headerItem.field]" :placeholder="headerItem?.tableForm?.placeholder || '选择时间'" |
|
|
|
style="width: 100%" :disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:format="headerItem?.tableForm?.format || 'HH:mm:ss'" |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'HH:mm:ss'" |
|
|
|
/> |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'HH:mm:ss'" /> |
|
|
|
</el-form-item> |
|
|
|
<!-- 日期选择器 --> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'FormDate'" :prop="headerItem.field"> |
|
|
|
<el-date-picker |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
style="width: 100%" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:placeholder="headerItem?.tableForm?.placeholder || '选择日期'" |
|
|
|
<el-date-picker v-model="row[headerItem.field]" style="width: 100%" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" :placeholder="headerItem?.tableForm?.placeholder || '选择日期'" |
|
|
|
:format="headerItem?.tableForm?.format || 'YYYY-MM-DD'" |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'YYYY-MM-DD'" |
|
|
|
/> |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'YYYY-MM-DD'" /> |
|
|
|
</el-form-item> |
|
|
|
<!-- 日期时间选择器 --> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'FormDateTime'" :prop="headerItem.field"> |
|
|
|
<el-date-picker |
|
|
|
type="datetime" |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:placeholder="headerItem?.tableForm?.placeholder || '选择日期时间'" |
|
|
|
style="width: 100%" |
|
|
|
<el-date-picker type="datetime" v-model="row[headerItem.field]" |
|
|
|
:placeholder="headerItem?.tableForm?.placeholder || '选择日期时间'" style="width: 100%" |
|
|
|
:format="headerItem?.tableForm?.format || 'YYYY-MM-DD HH:mm:ss'" |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'YYYY-MM-DDTHH:mm:ss'" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
/> |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" /> |
|
|
|
</el-form-item> |
|
|
|
<!--开始时间结束时间选择器 (原类型datetimerange已弃用 使用type+timeType结合方式)--> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'FormTimerange'" :prop="headerItem.field"> |
|
|
|
<el-date-picker |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:type="headerItem?.tableForm?.timeType || 'datetimerange'" |
|
|
|
range-separator="至" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
:format="headerItem?.tableForm?.format || 'YYYY-MM-DD HH:mm:ss'" |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'YYYY-MM-DDTHH:mm:ss'" |
|
|
|
/> |
|
|
|
<el-date-picker v-model="row[headerItem.field]" :disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:type="headerItem?.tableForm?.timeType || 'datetimerange'" range-separator="至" start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" :format="headerItem?.tableForm?.format || 'YYYY-MM-DD HH:mm:ss'" |
|
|
|
:value-format="headerItem?.tableForm?.valueFormat || 'YYYY-MM-DDTHH:mm:ss'" /> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
<!-- Switch 开关 --> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'Switch'" :prop="headerItem.field"> |
|
|
|
<el-switch |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:loading="headerItem?.tableForm?.loading" |
|
|
|
:size="headerItem?.tableForm?.size" |
|
|
|
:width="headerItem?.tableForm?.width" |
|
|
|
:active-icon="headerItem?.tableForm?.activeIcon" |
|
|
|
:inactive-icon="headerItem?.tableForm?.inactiveIcon" |
|
|
|
:active-text="headerItem?.tableForm?.activeText" |
|
|
|
:inactive-text="headerItem?.tableForm?.inactiveText" |
|
|
|
:active-value="headerItem?.tableForm?.activeValue" |
|
|
|
:inactive-value="headerItem?.tableForm?.inactiveValue" |
|
|
|
<el-switch v-model="row[headerItem.field]" :disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:loading="headerItem?.tableForm?.loading" :size="headerItem?.tableForm?.size" |
|
|
|
:active-icon="headerItem?.tableForm?.activeIcon" :inactive-icon="headerItem?.tableForm?.inactiveIcon" |
|
|
|
:active-text="headerItem?.tableForm?.activeText" :inactive-text="headerItem?.tableForm?.inactiveText" |
|
|
|
:active-value="headerItem?.tableForm?.activeValue" :inactive-value="headerItem?.tableForm?.inactiveValue" |
|
|
|
:active-color="headerItem?.tableForm?.inactiveColor" |
|
|
|
:inactive-color="headerItem?.tableForm?.inactiveColor" |
|
|
|
/> |
|
|
|
:inactive-color="headerItem?.tableForm?.inactiveColor" /> |
|
|
|
</el-form-item> |
|
|
|
<!-- Radio 单选--> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'Radio'" :prop="headerItem.field"> |
|
|
|
<el-radio-group |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:size="headerItem?.tableForm?.size" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:text-color="headerItem?.tableForm?.textColor" |
|
|
|
:fill="headerItem?.tableForm?.fill" |
|
|
|
:name="headerItem?.tableForm?.name" |
|
|
|
:id="headerItem?.tableForm?.id" |
|
|
|
> |
|
|
|
<el-radio |
|
|
|
v-for="(item, index) in initSelectOptions(headerItem)" |
|
|
|
:key="index" |
|
|
|
:label="item.value" |
|
|
|
:size="headerItem?.tableForm?.size" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:border="headerItem?.tableForm?.border" |
|
|
|
> |
|
|
|
<el-radio-group v-model="row[headerItem.field]" :size="headerItem?.tableForm?.size" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" :text-color="headerItem?.tableForm?.textColor" |
|
|
|
:fill="headerItem?.tableForm?.fill" :name="headerItem?.tableForm?.name" :id="headerItem?.tableForm?.id"> |
|
|
|
<el-radio v-for="(item, index) in initSelectOptions(headerItem)" :key="index" :label="item.value" |
|
|
|
:size="headerItem?.tableForm?.size" :disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:border="headerItem?.tableForm?.border"> |
|
|
|
{{ item.label }} |
|
|
|
</el-radio> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
<!-- Checkbox 单选--> |
|
|
|
<!-- Checkbox 多选--> |
|
|
|
<el-form-item v-if="headerItem?.tableForm?.type == 'Checkbox'" :prop="headerItem.field"> |
|
|
|
<el-checkbox-group |
|
|
|
v-model="row[headerItem.field]" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:size="headerItem?.tableForm?.size" |
|
|
|
:min="headerItem?.tableForm?.min" |
|
|
|
:max="headerItem?.tableForm?.max" |
|
|
|
:text-color="headerItem?.tableForm?.textColor" |
|
|
|
:fill="headerItem?.tableForm?.fill" |
|
|
|
> |
|
|
|
<el-checkbox |
|
|
|
v-for="(item, index) in initSelectOptions(headerItem)" |
|
|
|
:key="index" |
|
|
|
:label="item.value" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:true-label="headerItem?.tableForm?.trueLabel" |
|
|
|
:false-label="headerItem?.tableForm?.falseLabel" |
|
|
|
:border="headerItem?.tableForm?.border" |
|
|
|
:size="headerItem?.tableForm?.size" |
|
|
|
:name="headerItem?.tableForm?.name" |
|
|
|
:checked="headerItem?.tableForm?.checked" |
|
|
|
> |
|
|
|
<el-checkbox-group v-model="row[headerItem.field]" :disabled="itemIsDisabled(headerItem, row)" |
|
|
|
:size="headerItem?.tableForm?.size" :min="headerItem?.tableForm?.min" :max="headerItem?.tableForm?.max" |
|
|
|
:text-color="headerItem?.tableForm?.textColor" :fill="headerItem?.tableForm?.fill"> |
|
|
|
<el-checkbox v-for="(item, index) in initSelectOptions(headerItem)" :key="index" :label="item.value" |
|
|
|
:disabled="itemIsDisabled(headerItem, row)" :true-label="headerItem?.tableForm?.trueLabel" |
|
|
|
:false-label="headerItem?.tableForm?.falseLabel" :border="headerItem?.tableForm?.border" |
|
|
|
:size="headerItem?.tableForm?.size" :name="headerItem?.tableForm?.name" |
|
|
|
:checked="headerItem?.tableForm?.checked"> |
|
|
|
{{ item.label }} |
|
|
|
</el-checkbox> |
|
|
|
</el-checkbox-group> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
</el-table-column> |
|
|
|
<slot></slot> |
|
|
|
<template #empty> |
|
|
|
<el-empty class="vab-data-empty" description="暂无数据" /> |
|
|
|
</template> |
|
|
|
|
|
|
|
</el-table> |
|
|
|
<div class="button flex" v-if="isShowButton"> |
|
|
|
<div class="p-12px" @click="handleAdd"> |
|
|
|
<Icon icon="ep:circle-plus" color="#409eff" size="26" style="cursor: pointer;" /> |
|
|
|
<div>添加明细</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script lang="ts" setup> |
|
|
|
import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict' |
|
|
|
import { log } from 'console' |
|
|
|
const props = defineProps({ |
|
|
|
const props = defineProps({ |
|
|
|
// 是否显示删除按钮 |
|
|
|
isShowButton: { |
|
|
|
type: Boolean, |
|
|
|
default: true, |
|
|
|
}, |
|
|
|
// 是否显示选择框 :custom="headerItem.sortable?headerItem.sortable:false" |
|
|
|
selectionTable: { |
|
|
|
type: Boolean, |
|
|
@ -247,13 +162,19 @@ import { log } from 'console' |
|
|
|
height: { |
|
|
|
type: [Number, String], |
|
|
|
default: () => { |
|
|
|
return 'auto' |
|
|
|
return '200' |
|
|
|
} |
|
|
|
}, |
|
|
|
maxHeight: { |
|
|
|
type: [Number, String], |
|
|
|
default: () => { |
|
|
|
return '650' |
|
|
|
} |
|
|
|
}, |
|
|
|
// 是否有边框(可拖拽) |
|
|
|
border: { |
|
|
|
type: Boolean, |
|
|
|
default: true, |
|
|
|
default: false, |
|
|
|
}, |
|
|
|
// table输入表单的rules |
|
|
|
tableFormRules: { |
|
|
@ -261,18 +182,6 @@ import { log } from 'console' |
|
|
|
default: null |
|
|
|
} |
|
|
|
}) |
|
|
|
console.log(props.tableFields); |
|
|
|
// 某个item是否禁用 |
|
|
|
const itemIsDisabled = (colum, row) => { |
|
|
|
return Boolean(colum.tableForm?.disabled) || Boolean(row.disabled) || Boolean(row['disabled_' + colum.field]) |
|
|
|
} |
|
|
|
console.log(getStrDictOptions('uom')); |
|
|
|
|
|
|
|
// 获取下拉列表 | type = radio | type = select |
|
|
|
const initSelectOptions = (item) => { |
|
|
|
return item.dictType ? getStrDictOptions(item.dictType) : item.tableForm.initOptions |
|
|
|
} |
|
|
|
|
|
|
|
// 传递给父类 |
|
|
|
const emit = defineEmits([ |
|
|
|
'tableSelectionChange', |
|
|
@ -282,17 +191,114 @@ const emit = defineEmits([ |
|
|
|
'showDrawer', |
|
|
|
'selectCallback', |
|
|
|
'handleTableSelect', |
|
|
|
'handleDelete', |
|
|
|
'handleAdd' |
|
|
|
]) |
|
|
|
|
|
|
|
// 获取下拉列表 | type = radio | type = select |
|
|
|
const initSelectOptions = (item) => { |
|
|
|
return item.dictType ? getStrDictOptions(item.dictType) : item.tableForm.initOptions |
|
|
|
} |
|
|
|
//普通下拉改变事件 |
|
|
|
const formSelectChange = (field, val) => { |
|
|
|
emit('formSelectChange', field, val) |
|
|
|
} |
|
|
|
// 点击selection框 |
|
|
|
const tableSelectionChange = (val) => { |
|
|
|
emit('tableSelectionChange', val) |
|
|
|
} |
|
|
|
// 列表排序 |
|
|
|
const tableSortChange = (column, prop, order) => { |
|
|
|
emit('tableSortChange', column, prop, order) |
|
|
|
} |
|
|
|
//下拉框回显方法 |
|
|
|
const showSelect = (val, statusID) => { |
|
|
|
return getDictForStatusID(val, statusID) |
|
|
|
} |
|
|
|
|
|
|
|
// 行点击 |
|
|
|
const handleTableSelect = (row, column, event) => { |
|
|
|
emit('handleTableSelect', row, column, event) |
|
|
|
} |
|
|
|
|
|
|
|
// 某个item是否禁用 |
|
|
|
const itemIsDisabled = (colum, row) => { |
|
|
|
return Boolean(colum.tableForm?.disabled) || Boolean(row.disabled) || Boolean(row['disabled_' + colum.field]) |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const TableBaseComponents_Ref = ref() |
|
|
|
const TableBaseForm_Ref = ref() |
|
|
|
/** |
|
|
|
* 验证表单是否符合rules |
|
|
|
* @param {*} success 如果验证【成功】走的方法 |
|
|
|
* @param {*} error 如果验证【不成功】走的方法 |
|
|
|
*/ |
|
|
|
|
|
|
|
const $baseMessage = inject('$baseMessage') |
|
|
|
const validateForm = (success, error) => { |
|
|
|
let _lists = TableBaseForm_Ref.value.map(v => v.validate()) |
|
|
|
Promise.all(_lists).then(res => { |
|
|
|
if (success) success() |
|
|
|
}).catch(err => { |
|
|
|
if (error) { |
|
|
|
error() |
|
|
|
return |
|
|
|
} |
|
|
|
$baseMessage('验证未通过,请按规则填写', 'error', 'vab-hey-message-error') |
|
|
|
}) |
|
|
|
} |
|
|
|
// 删除数据 |
|
|
|
const handleDelete = (row, index) => { |
|
|
|
console.log(row); |
|
|
|
console.log(index); |
|
|
|
emit('handleDelete', row) |
|
|
|
} |
|
|
|
// 添加数据 |
|
|
|
const handleAdd = () => { |
|
|
|
emit('handleAdd') |
|
|
|
} |
|
|
|
// setup 语法糖 抛出方法 |
|
|
|
defineExpose({ |
|
|
|
TableBaseComponents_Ref, |
|
|
|
validateForm |
|
|
|
}) |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
::v-deep(.el-form-item){ |
|
|
|
margin-bottom: 0px; |
|
|
|
::v-deep(.el-table__body){ |
|
|
|
padding:10px 0px |
|
|
|
} |
|
|
|
::v-deep(.el-table--default .el-table__cell) { |
|
|
|
padding: 2px 0px; |
|
|
|
border: none; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep(.el-table td.el-table__cell div) { |
|
|
|
display: flex !important; |
|
|
|
align-items: center !important; |
|
|
|
justify-content: center !important; |
|
|
|
overflow: visible; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep(.el-icon) { |
|
|
|
display: block; |
|
|
|
} |
|
|
|
|
|
|
|
.button { |
|
|
|
>div { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
>div { |
|
|
|
margin-left: 6px; |
|
|
|
text-decoration: underline; |
|
|
|
color: #409eff; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
</style> |
|
|
|