|
|
@@ -1,252 +1,98 @@
|
|
|
<template>
|
|
|
<div style="position: relative" ref="commonTable">
|
|
|
<!--表格栏-->
|
|
|
- <el-table
|
|
|
- id="commonTable"
|
|
|
- ref="doLayout"
|
|
|
- :data="data.content"
|
|
|
- :highlight-current-row="highlightCurrentRow"
|
|
|
- @selection-change="selectionChange"
|
|
|
- @row-click="rowClick"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- :element-loading-text="$t('action.loading')"
|
|
|
- :border="border"
|
|
|
- :stripe="stripe"
|
|
|
- :show-summary="showSummary"
|
|
|
- :summary-method="getSummaries"
|
|
|
- :show-overflow-tooltip="showOverflowTooltip"
|
|
|
- :height="tableHeight"
|
|
|
- :size="size"
|
|
|
- :align="align"
|
|
|
- :header-cell-style="{
|
|
|
+ <el-table id="commonTable" ref="doLayout" :data="data.content" :highlight-current-row="highlightCurrentRow"
|
|
|
+ @selection-change="selectionChange" @row-click="rowClick" @current-change="handleCurrentChange"
|
|
|
+ :element-loading-text="$t('action.loading')" :border="border" :stripe="stripe" :show-summary="showSummary"
|
|
|
+ :summary-method="getSummaries" :show-overflow-tooltip="showOverflowTooltip" :height="tableHeights? tableHeights:tableHeight" :size="size"
|
|
|
+ :align="align" :header-cell-style="{
|
|
|
background: '#F2F7FC',
|
|
|
fontWeight: '900',
|
|
|
color: '#606266',
|
|
|
- }"
|
|
|
- style="width: 100%"
|
|
|
- :row-class-name="tableRowClassName"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- type="selection"
|
|
|
- width="50"
|
|
|
- fixed
|
|
|
- align="center"
|
|
|
- v-if="showBatchDelete || showBatchSettled || showBatchPrint"
|
|
|
- ></el-table-column>
|
|
|
- <el-table-column
|
|
|
- v-if="SerialShow"
|
|
|
- label="序号"
|
|
|
- type="index"
|
|
|
- width="50"
|
|
|
- align="center"
|
|
|
- ></el-table-column>
|
|
|
+ }" style="width: 100%" :row-class-name="tableRowClassName">
|
|
|
+ <el-table-column type="selection" width="50" fixed align="center"
|
|
|
+ v-if="showBatchDelete || showBatchSettled || showBatchPrint"></el-table-column>
|
|
|
+ <el-table-column v-if="SerialShow" label="序号" type="index" width="50" align="center"></el-table-column>
|
|
|
<template v-for="column in columns">
|
|
|
- <el-table-column
|
|
|
- header-align="center"
|
|
|
- align="center"
|
|
|
- :prop="column.prop"
|
|
|
- :label="column.label"
|
|
|
- :width="column.width"
|
|
|
- :min-width="column.minWidth"
|
|
|
- :fixed="column.fixed"
|
|
|
- :key="column.prop"
|
|
|
- :type="column.type"
|
|
|
- :formatter="column.formatter"
|
|
|
- :sortable="column.sortable ? column.sortable : false"
|
|
|
- v-if="column.signIcon || column.isImg || column.isBtn"
|
|
|
- >
|
|
|
+ <el-table-column header-align="center" align="center" :prop="column.prop" :label="column.label"
|
|
|
+ :width="column.width" :min-width="column.minWidth" :fixed="column.fixed" :key="column.prop" :type="column.type"
|
|
|
+ :formatter="column.formatter" :sortable="column.sortable ? column.sortable : false"
|
|
|
+ v-if="column.signIcon || column.isImg || column.isBtn">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-switch
|
|
|
- :disabled="column.isDisabled"
|
|
|
- v-if="column.signIcon"
|
|
|
- v-model="scope.row[column.prop]"
|
|
|
- active-value="1"
|
|
|
- inactive-value="0"
|
|
|
- @change="signStateChanged(scope.$index, scope.row)"
|
|
|
- ></el-switch>
|
|
|
- <img
|
|
|
- v-if="column.isImg"
|
|
|
- :width="column.imgWidth"
|
|
|
- :height="column.imgHeight"
|
|
|
- :src="scope.row[column.prop]"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- v-if="column.isBtn"
|
|
|
- icon="fa fa-edit"
|
|
|
- :label="column.btnName"
|
|
|
- :size="size"
|
|
|
- :perms="column.permsEdit"
|
|
|
- @click="handleBtnEdit(scope.$index, scope.row)"
|
|
|
- />
|
|
|
+ <el-switch :disabled="column.isDisabled" v-if="column.signIcon" v-model="scope.row[column.prop]"
|
|
|
+ active-value="1" inactive-value="0" @change="signStateChanged(scope.$index, scope.row)"></el-switch>
|
|
|
+ <img v-if="column.isImg" :width="column.imgWidth" :height="column.imgHeight" :src="scope.row[column.prop]" />
|
|
|
+ <kt-button v-if="column.isBtn" icon="fa fa-edit" :label="column.btnName" :size="size"
|
|
|
+ :perms="column.permsEdit" @click="handleBtnEdit(scope.$index, scope.row)" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- header-align="center"
|
|
|
- align="center"
|
|
|
- :prop="column.prop"
|
|
|
- :label="column.label"
|
|
|
- :width="column.width"
|
|
|
- :min-width="column.minWidth"
|
|
|
- :fixed="column.fixed"
|
|
|
- :key="column.prop"
|
|
|
- :type="column.type"
|
|
|
- :formatter="column.formatter"
|
|
|
- :sortable="column.sortable ? column.sortable : false"
|
|
|
- v-else
|
|
|
- >
|
|
|
+ <el-table-column header-align="center" align="center" :prop="column.prop" :label="column.label"
|
|
|
+ :width="column.width" :min-width="column.minWidth" :fixed="column.fixed" :key="column.prop" :type="column.type"
|
|
|
+ :formatter="column.formatter" :sortable="column.sortable ? column.sortable : false" v-else>
|
|
|
<template v-for="columnchildren in column.children">
|
|
|
- <el-table-column
|
|
|
- v-if="columnchildren"
|
|
|
- header-align="center"
|
|
|
- align="center"
|
|
|
- :prop="columnchildren.prop"
|
|
|
- :label="columnchildren.label"
|
|
|
- :width="columnchildren.width"
|
|
|
- :min-width="columnchildren.minWidth"
|
|
|
- :fixed="columnchildren.fixed"
|
|
|
- :key="columnchildren.prop"
|
|
|
- :type="columnchildren.type"
|
|
|
- :formatter="columnchildren.formatter"
|
|
|
- :sortable="
|
|
|
- columnchildren.sortable == null ? true : columnchildren.sortable
|
|
|
- "
|
|
|
- >
|
|
|
+ <el-table-column v-if="columnchildren" header-align="center" align="center" :prop="columnchildren.prop"
|
|
|
+ :label="columnchildren.label" :width="columnchildren.width" :min-width="columnchildren.minWidth"
|
|
|
+ :fixed="columnchildren.fixed" :key="columnchildren.prop" :type="columnchildren.type"
|
|
|
+ :formatter="columnchildren.formatter" :sortable="columnchildren.sortable == null ? true : columnchildren.sortable
|
|
|
+ ">
|
|
|
</el-table-column>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</template>
|
|
|
- <el-table-column
|
|
|
- :label="$t('action.operation')"
|
|
|
- :width="operationWidth"
|
|
|
- fixed="right"
|
|
|
- v-if="showOperation"
|
|
|
- header-align="center"
|
|
|
- align="center"
|
|
|
- >
|
|
|
+ <el-table-column :label="$t('action.operation')" :width="operationWidth" fixed="right" v-if="showOperation"
|
|
|
+ header-align="center" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
- <kt-button
|
|
|
- style="
|
|
|
+ <kt-button style="
|
|
|
background: #1e87ed;
|
|
|
border: 1px solid #1e87ed;
|
|
|
color: #ffffff;
|
|
|
- "
|
|
|
- v-if="editButtonName"
|
|
|
- icon="fa fa-edit"
|
|
|
- :label="editButtonName"
|
|
|
- :perms="permsEdit"
|
|
|
- :size="size"
|
|
|
- @click="handleEdit(scope.$index, scope.row)"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- v-if="deleteButtonName"
|
|
|
- icon="fa fa-trash"
|
|
|
- :label="deleteButtonName"
|
|
|
- :perms="permsDelete"
|
|
|
- :size="size"
|
|
|
- type="danger"
|
|
|
- @click="handleDeleteFlag(scope.$index, scope.row)"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- :style="{
|
|
|
- background: button1Background + '',
|
|
|
- border: '1px solid' + button1Background,
|
|
|
- color: '#fff',
|
|
|
- }"
|
|
|
- v-if="button1Name"
|
|
|
- :label="button1Name"
|
|
|
- :perms="permsButton1"
|
|
|
- :size="size"
|
|
|
- :icon="button1Icon"
|
|
|
- @click="handleButton1(scope.$index, scope.row)"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- :style="{
|
|
|
- background: button2Background,
|
|
|
- border: '1px solid' + button2Background,
|
|
|
- color: '#fff',
|
|
|
- }"
|
|
|
- v-if="button2Name"
|
|
|
- :label="button2Name"
|
|
|
- :perms="permsButton2"
|
|
|
- :size="size"
|
|
|
- :icon="button2Icon"
|
|
|
- @click="handleButton2(scope.$index, scope.row)"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- :style="{
|
|
|
- background: button3Background,
|
|
|
- border: '1px solid' + button3Background,
|
|
|
- color: '#fff',
|
|
|
- }"
|
|
|
- v-if="button3Name"
|
|
|
- :label="button3Name"
|
|
|
- :perms="permsButton3"
|
|
|
- :size="size"
|
|
|
- :icon="button3Icon"
|
|
|
- @click="handleButton3(scope.$index, scope.row)"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- :style="{
|
|
|
- background: button4Background,
|
|
|
- border: '1px solid ' + button4Background,
|
|
|
- color: '#ffffff',
|
|
|
- }"
|
|
|
- v-if="button4Name"
|
|
|
- :icon="button4Icon"
|
|
|
- :label="button4Name"
|
|
|
- :perms="permsButton4"
|
|
|
- :size="size"
|
|
|
- @click="handleButton4(scope.$index, scope.row)"
|
|
|
- />
|
|
|
+ " v-if="editButtonName" icon="fa fa-edit" :label="editButtonName" :perms="permsEdit" :size="size"
|
|
|
+ @click="handleEdit(scope.$index, scope.row)" />
|
|
|
+ <kt-button v-if="deleteButtonName" icon="fa fa-trash" :label="deleteButtonName" :perms="permsDelete"
|
|
|
+ :size="size" type="danger" @click="handleDeleteFlag(scope.$index, scope.row)" />
|
|
|
+ <kt-button :style="{
|
|
|
+ background: button1Background + '',
|
|
|
+ border: '1px solid' + button1Background,
|
|
|
+ color: '#fff',
|
|
|
+ }" v-if="button1Name" :label="button1Name" :perms="permsButton1" :size="size" :icon="button1Icon"
|
|
|
+ @click="handleButton1(scope.$index, scope.row)" />
|
|
|
+ <kt-button :style="{
|
|
|
+ background: button2Background,
|
|
|
+ border: '1px solid' + button2Background,
|
|
|
+ color: '#fff',
|
|
|
+ }" v-if="button2Name" :label="button2Name" :perms="permsButton2" :size="size" :icon="button2Icon"
|
|
|
+ @click="handleButton2(scope.$index, scope.row)" />
|
|
|
+ <kt-button :style="{
|
|
|
+ background: button3Background,
|
|
|
+ border: '1px solid' + button3Background,
|
|
|
+ color: '#fff',
|
|
|
+ }" v-if="button3Name" :label="button3Name" :perms="permsButton3" :size="size" :icon="button3Icon"
|
|
|
+ @click="handleButton3(scope.$index, scope.row)" />
|
|
|
+ <kt-button :style="{
|
|
|
+ background: button4Background,
|
|
|
+ border: '1px solid ' + button4Background,
|
|
|
+ color: '#ffffff',
|
|
|
+ }" v-if="button4Name" :icon="button4Icon" :label="button4Name" :perms="permsButton4" :size="size"
|
|
|
+ @click="handleButton4(scope.$index, scope.row)" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<!--分页栏-->
|
|
|
<!-- 底部分页 -->
|
|
|
<div class="bottomFixed" ref="bottomFixed">
|
|
|
- <kt-button
|
|
|
- class="debutton"
|
|
|
- :label="$t('action.batchDelete')"
|
|
|
- :perms="permsDelete"
|
|
|
- :size="size"
|
|
|
- type="danger"
|
|
|
- @click="handleBatchDelete()"
|
|
|
- :disabled="selections.length === 0"
|
|
|
- style="float: left"
|
|
|
- v-if="showBatchDelete & showOperation"
|
|
|
- />
|
|
|
- <kt-button
|
|
|
- :label="settledName"
|
|
|
- :perms="permsDelete"
|
|
|
- :size="size"
|
|
|
- type="danger"
|
|
|
- @click="handleBatchSettled()"
|
|
|
- :disabled="selections.length === 0"
|
|
|
- style="float: left"
|
|
|
- v-if="showBatchSettled"
|
|
|
- />
|
|
|
+ <kt-button class="debutton" :label="$t('action.batchDelete')" :perms="permsDelete" :size="size" type="danger"
|
|
|
+ @click="handleBatchDelete()" :disabled="selections.length === 0" style="float: left"
|
|
|
+ v-if="showBatchDelete & showOperation" />
|
|
|
+ <kt-button :label="settledName" :perms="permsDelete" :size="size" type="danger" @click="handleBatchSettled()"
|
|
|
+ :disabled="selections.length === 0" style="float: left" v-if="showBatchSettled" />
|
|
|
<!-- <kt-button label="导出Excel" :perms="permsDelete" :size="size" type="danger" @click="handleBatchPrint()"
|
|
|
:disabled="selections.length === 0" style="float: left" v-if="showBatchPrint" /> -->
|
|
|
- <kt-button
|
|
|
- label="导出Excel"
|
|
|
- :perms="permsDelete"
|
|
|
- :size="size"
|
|
|
- type="danger"
|
|
|
- @click="handleBatchPrint()"
|
|
|
- style="float: left"
|
|
|
- v-if="showBatchPrint"
|
|
|
- />
|
|
|
- <el-pagination
|
|
|
- @size-change="handleSizeChange"
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
- @current-change="refreshPageRequest"
|
|
|
- :current-page="data.pageNum"
|
|
|
- :page-size="data.pageSize"
|
|
|
- :page-sizes="[10, 20, 50, 100, 200, 300, 400, 500]"
|
|
|
- :total="data.totalSize"
|
|
|
- style="float: left; margin-left: 20px"
|
|
|
- v-if="isshowpagination"
|
|
|
- >
|
|
|
+ <kt-button label="导出Excel" :perms="permsDelete" :size="size" type="danger" @click="handleBatchPrint()"
|
|
|
+ style="float: left" v-if="showBatchPrint" />
|
|
|
+ <el-pagination @size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ @current-change="refreshPageRequest" :current-page="data.pageNum" :page-size="data.pageSize"
|
|
|
+ :page-sizes="[10, 20, 50, 100, 200, 300, 400, 500]" :total="data.totalSize" style="float: left; margin-left: 20px"
|
|
|
+ v-if="isshowpagination">
|
|
|
</el-pagination>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -260,6 +106,9 @@ export default {
|
|
|
KtButton,
|
|
|
},
|
|
|
props: {
|
|
|
+ tableHeights:{
|
|
|
+ type: Number,
|
|
|
+ },
|
|
|
operationWidth: {
|
|
|
type: Number,
|
|
|
default: 200,
|
|
|
@@ -647,7 +496,7 @@ export default {
|
|
|
callback: callback,
|
|
|
});
|
|
|
})
|
|
|
- .catch(() => {});
|
|
|
+ .catch(() => { });
|
|
|
},
|
|
|
//批量结算
|
|
|
handleBatchSettled: function () {
|