9d8bcb26
wesley88
2
|
1
2
|
<template>
<div class="policy-selector">
|
a182f238
wesley88
1
|
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
<div class="policy-selector-content">
<div style="border: 1px solid #E5E5E5;padding: 1px" id="huodong">
<div
style="padding: 10px 13px;font-size: 14px;border-bottom: 1px solid #E5E5E5;display: flex;justify-content: space-between;">
<div style="line-height:200%">选择策略</div>
<div style="display: flex">
<el-input placeholder="请输入" suffix-icon="el-icon-search" style="margin-right:15px;width: 40%;"
v-model="pageindex.policyName">
</el-input>
<el-button @click="onSearch" style="background-color: #3F9B6A;color: #fff">查询
</el-button>
<el-button @click="resetting" class="buttonHover"
style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;">重置
</el-button>
</div>
</div>
<div style="padding: 15px;">
<div style="padding: 0px 20px 0px 0px;max-height:40vh;overflow-y: auto;">
<el-table :data="celueData" tooltip-effect="dark" @selection-change="handleSelectionChange"
:header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}">
<el-table-column label="选择" type="selection" width="55">
</el-table-column>
<el-table-column label="策略名称" prop="policyName" show-overflow-tooltip></el-table-column>
<el-table-column label="适用资源" prop="applicableResources" show-overflow-tooltip></el-table-column>
<el-table-column label="租金价格" prop="rentalPrice" show-overflow-tooltip></el-table-column>
<el-table-column label="付款周期" prop="leaseTerm" show-overflow-tooltip></el-table-column>
<el-table-column label="付款日" prop="payDay" show-overflow-tooltip></el-table-column>
</el-table>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-between;margin: 20px 0;" class="bom">
<div style="font-size: 14px;">共 <span style="color: #3F9B6A;">{{total}}</span> 项数据</div>
<el-pagination :current-page="pageindex.pageNumber+1" :page-sizes="[5,10, 20, 50, 100]" :page-size="pageindex.pageSize" background
small layout="prev, pager, next" :total="total" @size-change="handleSizeChange"
@current-change="handleCurrentChange">
</el-pagination>
|
9d8bcb26
wesley88
2
|
41
42
43
|
</div>
<div class="policy-selector-footer" style="display: flex; justify-content: flex-end; align-items: center;">
<el-button @click="confirm" style="background-color: #3F9B6A;color: #fff;">确定</el-button>
|
a182f238
wesley88
1
|
44
45
|
<el-button @click="cancel" class="buttonHover"
style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;">取消</el-button>
|
9d8bcb26
wesley88
2
|
46
47
48
49
50
51
52
53
|
</div>
</div>
</template>
<script>
import {
ceGetAll
} from '@/api/sam.js'
|
a182f238
wesley88
1
|
54
55
56
57
58
|
export default {
name: 'PolicySelector',
data() {
return {
total: 0,
|
9d8bcb26
wesley88
2
|
59
|
pageindex: {
|
a182f238
wesley88
1
|
60
61
62
|
pageNumber: 0,
pageSize: 5,
policyName: ''
|
9d8bcb26
wesley88
2
|
63
|
},
|
a182f238
wesley88
1
|
64
65
66
|
selectedRows: [],
celueData: []
};
|
9d8bcb26
wesley88
2
|
67
|
},
|
a182f238
wesley88
1
|
68
69
|
created() {
this.getAll()
|
9d8bcb26
wesley88
2
|
70
|
},
|
a182f238
wesley88
1
|
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
|
methods: {
async getAll() {
const celue = await ceGetAll(this.pageindex)
this.celueData = celue.data.content
this.total = celue.data.totalElements
},
handleCurrentChange(val) {
this.pageindex.pageNumber = val-1
this.getAll()
},
handleSizeChange(val) {
this.pageindex.pageSize = val
},
onSearch() {
this.pageindex.pageNumber = 0
this.getAll()
},
resetting() {
this.pageindex ={
pageNumber: 0,
pageSize: 5,
policyName: ''
}
this.getAll()
},
handleSelectionChange(selection) {
this.selectedRows = selection;
},
confirm() {
this.$emit('minSev', this.selectedRows);
},
cancel() {
this.$emit('mingClose');
}
|
9d8bcb26
wesley88
2
|
105
|
}
|
a182f238
wesley88
1
|
106
|
};
|
9d8bcb26
wesley88
2
|
107
108
109
|
</script>
<style scoped>
|
a182f238
wesley88
1
|
110
111
112
113
114
115
116
117
|
.policy-selector {
padding: 20px;
width: 100%;
margin: 0 auto;
border: 1px solid #ddd;
/* border-radius: 4px; */
/* box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); */
}
|
9d8bcb26
wesley88
2
|
118
|
|
a182f238
wesley88
1
|
119
120
121
122
|
.policy-selector-header {
text-align: left;
margin-bottom: 20px;
}
|
9d8bcb26
wesley88
2
|
123
|
|
a182f238
wesley88
1
|
124
125
126
127
128
|
.policy-selector-header h3 {
margin: 0;
font-size: 18px;
color: #303133;
}
|
9d8bcb26
wesley88
2
|
129
|
|
a182f238
wesley88
1
|
130
131
132
|
.policy-selector-content {
margin-bottom: 20px;
}
|
9d8bcb26
wesley88
2
|
133
|
|
a182f238
wesley88
1
|
134
135
136
137
138
139
|
.policy-selector-footer {
display: flex;
justify-content: flex-end;
align-items: center;
}
</style>
|