cl.vue
2.97 KB
1
2
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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
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
<template>
<div class="policy-selector">
<div class="policy-selector-header">
<h3>选择策略</h3>
</div>
<div class="policy-selector-content" style="max-height:50vh;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" min-width="200"></el-table-column>
<el-table-column label="适用资源" prop="applicableResources" min-width="100"></el-table-column>
<el-table-column label="经营类型" prop="businessType" min-width="150"></el-table-column>
<el-table-column label="租金价格" prop="rentalPrice" min-width="150"></el-table-column>
<el-table-column label="租期" prop="leaseTerm" min-width="100"></el-table-column>
<el-table-column label="是否出租" prop="planningObjectives" min-width="100">
<template slot-scope="scope">
{{ scope.row.isrental == '0' ? '否' : '是' }}
</template>
</el-table-column>
<el-table-column label="是否自营" prop="planningObjectives" min-width="100">
<template slot-scope="scope">
{{ scope.row.isSelfOperated == '0' ? '否' : '是' }}
</template>
</el-table-column>
</el-table>
</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>
<el-button @click="cancel" class="buttonHover" style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;">取消</el-button>
</div>
</div>
</template>
<script>
import {
ceGetAll
} from '@/api/sam.js'
export default {
name: 'PolicySelector',
data() {
return {
pageindex: {
pageNumber: 1,
pageSize: 10,
},
selectedRows: [],
celueData: []
};
},
async created() {
const celue = await ceGetAll(this.pageindex)
this.celueData = celue.data.content
},
methods: {
handleSelectionChange(selection) {
this.selectedRows = selection;
},
confirm() {
this.$emit('minSev', this.selectedRows);
},
cancel() {
this.$emit('mingClose');
}
}
};
</script>
<style scoped>
.policy-selector {
padding: 30px;
width: 100%;
margin: 0 auto;
border: 1px solid #ddd;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.policy-selector-header {
text-align: left;
margin-bottom: 20px;
}
.policy-selector-header h3 {
margin: 0;
font-size: 18px;
color: #303133;
}
.policy-selector-content {
margin-bottom: 20px;
}
.policy-selector-footer {
display: flex;
justify-content: flex-end;
align-items: center;
}
</style>