framework / eagle-web-toolkit

Download as
Browse Code »

Commit 8ae022c8d1c6ff00431a7360a1c336cb0a3e891e

Authored by Aaron
1 parent 3268a18c
Exists in master and in 1 other branch legacy

Scheme表格按钮支持替换与控制显示

Showing 3 changed files with 28 additions and 14 deletions   Show diff stats
examples/main.js
  Diff comments   View file @8ae022c
... ... @@ -18,7 +18,7 @@ const request = axios.create({
18 18 timeout: 1000 * 60,
19 19 withCredentials: true,
20 20 headers: {
21   - token: '04c8fe07d7ded87936343ef8f0a6767a',
  21 + token: '5d3cb24cecd69e7d61d3c84912735e09',
22 22 'Accept-Language': 'zh-CN'
23 23 }
24 24 });
... ...
examples/views/page/test.vue
  Diff comments   View file @8ae022c
1 1 <template>
2   - <eagle-scheme class="p-3" :list="schemeList" :option="{ $http: $axios, url: '/overseas/price/sale' }">
  2 + <eagle-scheme class="p-3" :list="schemeList" :option="{ $http: $axios, url: '/overseas/price/sale', showActionBtnDelete: false }">
3 3 <template #search-enableFlag="{ model }">
4 4 <eagle-select v-model="model.enableFlag" :dataSource="[{ label: '正常', value: true }, { label: '禁用', value: false }]"></eagle-select>
5 5 </template>
... ... @@ -9,6 +9,12 @@
9 9 <span slot-scope="{ row: { productName, productCode } }">{{ productName || productCode }}</span>
10 10 </el-table-column>
11 11 </template>
  12 + <template #action-btn-new>
  13 + <el-button>按钮</el-button>
  14 + </template>
  15 + <template #table-operation-btn-edit>
  16 + <el-button class="eagle-scheme__table-btn" type="text">测试</el-button>
  17 + </template>
12 18 <template #table-append>
13 19 <el-table-column prop="createTime" label="创建时间" min-width="180"></el-table-column>
14 20 <el-table-column prop="createUser" label="创建人" min-width="160" show-overflow-tooltip></el-table-column>
... ...
packages/scheme/index.vue
  Diff comments   View file @8ae022c
... ... @@ -33,11 +33,17 @@
33 33 display: flex;
34 34 align-items: center;
35 35 }
36   -.eagle-scheme__table .eagle-scheme__table-btn:not(:last-child) {
37   - padding-left: 0px;
38   - padding-right: 10px;
39   - margin-left: 0px;
40   - margin-right: 0px;
  36 +.eagle-scheme__table .eagle-scheme__table-btn {
  37 + padding-left: 0px !important;
  38 + padding-right: 10px !important;
  39 + margin-left: 0px !important;
  40 + margin-right: 0px !important;
  41 +}
  42 +.eagle-scheme__table .eagle-scheme__table-btn:last-child {
  43 + padding-left: 0px !important;
  44 + padding-right: 0px !important;
  45 + margin-left: 0px !important;
  46 + margin-right: 0px !important;
41 47 }
42 48 .eagle-scheme__pagination {
43 49 text-align: right;
... ... @@ -63,10 +69,11 @@
63 69 <div v-if="option.showActionBar !== false" class="eagle-scheme__action" v-loading="tableLoading" element-loading-spinner="none" element-loading-background="rgba(255, 255, 255, 0.6)">
64 70 <slot v-if="$scopedSlots['action-bar'] || $slots['action-bar']" name="action-bar" :handleNew="handleNew" :handleDelete="handleDelete" :model="formModel" :selection="tableSelection" :setDialog="setDialog"></slot>
65 71 <template v-else>
66   - <el-button class="eagle-scheme__action-btn" type="primary" size="small" @click="handleNew">{{ i18n('eagle.scheme.new') || '新增' }}</el-button>
67   - <el-button v-if="hasSelectionSlot" :disabled="tableSelection && tableSelection.length <= 0" class="eagle-scheme__action-btn" plain size="small" @click="handleDelete('more')">{{ i18n('eagle.scheme.delete') || '删除' }}</el-button>
68   - <slot v-if="$scopedSlots['action-button'] || $slots['action-button']" name="action-button" class="eagle-scheme__action-btn" :model="formModel" :selection="tableSelection" :setDialog="setDialog"></slot>
69   - <div v-if="hasSelectionSlot && tableSelection && tableSelection.length > 0" class="eagle-scheme__action-btn eagle-scheme__text-selection">{{ i18n('eagle.scheme.checked') || '已选中' }}<span class="eagle-scheme__text-selection-highlight">{{ tableSelection.length }}</span>{{ i18n('eagle.scheme.item') || '项' }}</div>
  72 + <slot v-if="$scopedSlots['action-btn-new'] || $slots['action-btn-new']" name="action-btn-new" :handleNew="handleNew" :handleEdit="handleEdit" :handleDelete="handleDelete" :handleView="handleView" :model="formModel" :selection="tableSelection" :setDialog="setDialog"></slot>
  73 + <el-button v-else class="eagle-scheme__action-btn" type="primary" size="small" @click="handleNew">{{ i18n('eagle.scheme.new') || '新增' }}</el-button>
  74 + <el-button v-if="hasSelectionSlot && option.showActionBtnDelete !== false" :disabled="tableSelection && tableSelection.length <= 0" class="eagle-scheme__action-btn" plain size="small" @click="handleDelete('more')">{{ i18n('eagle.scheme.delete') || '删除' }}</el-button>
  75 + <slot v-if="$scopedSlots['action-button'] || $slots['action-button']" name="action-button" class="eagle-scheme__action-btn" :handleNew="handleNew" :handleEdit="handleEdit" :handleDelete="handleDelete" :handleView="handleView" :model="formModel" :selection="tableSelection" :setDialog="setDialog"></slot>
  76 + <div v-if="hasSelectionSlot && tableSelection && tableSelection.length > 0 && option.showActionBtnDelete !== false" class="eagle-scheme__action-btn eagle-scheme__text-selection">{{ i18n('eagle.scheme.checked') || '已选中' }}<span class="eagle-scheme__text-selection-highlight">{{ tableSelection.length }}</span>{{ i18n('eagle.scheme.item') || '项' }}</div>
70 77 </template>
71 78 </div>
72 79 <div class="eagle-scheme__table">
... ... @@ -91,7 +98,7 @@
91 98 </template>
92 99 <!-- 表格操作栏插槽 - 自定义 -->
93 100 <template v-if="$scopedSlots['table-operation'] || $slots['table-operation']">
94   - <slot name="table-operation" slot="$end"></slot>
  101 + <slot name="table-operation" slot="$end" :handleView="handleView" :handleEdit="handleEdit" :handleDelete="handleDelete"></slot>
95 102 </template>
96 103 <!-- 表格操作栏插槽 - 默认 -->
97 104 <el-table-column v-else slot="$end" prop="$operation" :label="i18n('eagle.scheme.operation') || '操作'" min-width="140" fixed="right">
... ... @@ -99,8 +106,9 @@
99 106 <!-- 表格操作栏插槽 - 前置插槽 -->
100 107 <slot v-if="$scopedSlots['table-operation-btn'] || $slots['table-operation-btn']" name="table-operation-btn"></slot>
101 108 <el-button v-if="option.showViewBtn !== false" class="eagle-scheme__table-btn" type="text" icon="el-icon-view" :title="i18n('eagle.scheme.detail') || '详情'" @click="handleView(slotScope)"></el-button>
102   - <el-button class="eagle-scheme__table-btn" type="text" icon="el-icon-edit" :title="i18n('eagle.scheme.edit') || '编辑'" @click="handleEdit(slotScope)"></el-button>
103   - <eagle-confirm class="eagle-scheme__table-btn" :title="i18n('eagle.scheme.deleteConfirm') || '是否删除？'" @confirm="handleDelete('one', slotScope)">
  109 + <slot v-if="$scopedSlots['table-operation-btn-edit'] || $slots['table-operation-btn-edit']" name="table-operation-btn-edit" :handleEdit="handleEdit"></slot>
  110 + <el-button v-else-if="option.showEditBtn !== false" class="eagle-scheme__table-btn" type="text" icon="el-icon-edit" :title="i18n('eagle.scheme.edit') || '编辑'" @click="handleEdit(slotScope)"></el-button>
  111 + <eagle-confirm v-if="option.showDeleteBtn !== false" class="eagle-scheme__table-btn" :title="i18n('eagle.scheme.deleteConfirm') || '是否删除？'" @confirm="handleDelete('one', slotScope)">
104 112 <el-button type="text" icon="el-icon-delete" :title="i18n('eagle.scheme.delete') || '删除'"></el-button>
105 113 </eagle-confirm>
106 114 <!-- 表格操作栏插槽 - 后置插槽 -->
... ...