|
@@ -71,10 +71,10 @@
|
71
|
71
|
<tr>
|
72
|
72
|
<th colspan="7">
|
73
|
73
|
<div class="table_header">
|
74
|
|
- <div class="table_header_title">应用策略列表</div>
|
|
74
|
+ <div class="table_header_title">应用策略{{ groupIndex + 1 }}</div>
|
75
|
75
|
<div class="table_header_action">
|
76
|
|
- <div>编辑</div>
|
77
|
|
- <div class="del">删除</div>
|
|
76
|
+ <div @click="toEditeGroupItem(groupItem, groupIndex)">编辑</div>
|
|
77
|
+ <div class="del" @click="toDelGroupItem(groupIndex)">删除</div>
|
78
|
78
|
</div>
|
79
|
79
|
</div>
|
80
|
80
|
</th>
|
|
@@ -84,17 +84,35 @@
|
84
|
84
|
{{ weekItem.label }}
|
85
|
85
|
</td>
|
86
|
86
|
</tr>
|
|
87
|
+ <tr>
|
|
88
|
+ <td v-for="weekItem in weekDay" :key="weekItem.value">
|
|
89
|
+ <div class="time_list">
|
|
90
|
+ <span
|
|
91
|
+ v-for="(timeItem, timeIndex) in appStrategyGroupInfo[
|
|
92
|
+ groupIndex
|
|
93
|
+ ][weekItem.value]"
|
|
94
|
+ :key="timeIndex"
|
|
95
|
+ >{{ timeItem.starttime }} - {{ timeItem.stoptime }}</span
|
|
96
|
+ >
|
|
97
|
+ </div>
|
|
98
|
+ </td>
|
|
99
|
+ </tr>
|
87
|
100
|
<tr>
|
88
|
101
|
<td colspan="7">
|
89
|
102
|
<div class="table_app_list">
|
90
|
103
|
<div
|
91
|
104
|
class="table_app_item"
|
92
|
|
- v-for="appItem in groupItem.apps"
|
93
|
|
- :key="appItem.appid"
|
|
105
|
+ v-for="appid in groupItem.apps"
|
|
106
|
+ :key="appid"
|
94
|
107
|
>
|
95
|
|
- <div class="app_top"></div>
|
|
108
|
+ <div class="app_top">
|
|
109
|
+ <img
|
|
110
|
+ v-if="appsInfo[appid]"
|
|
111
|
+ :src="$api.showImageUrl + appsInfo[appid].appIcon"
|
|
112
|
+ />
|
|
113
|
+ </div>
|
96
|
114
|
<div class="app_name">
|
97
|
|
- {{ appsInfo[appItem.appid].appName }}
|
|
115
|
+ {{ appsInfo[appid] && appsInfo[appid].appName }}
|
98
|
116
|
</div>
|
99
|
117
|
</div>
|
100
|
118
|
</div>
|
|
@@ -153,9 +171,37 @@ export default {
|
153
|
171
|
info[item.appid] = item;
|
154
|
172
|
});
|
155
|
173
|
return info;
|
|
174
|
+ },
|
|
175
|
+ appStrategyGroupInfo() {
|
|
176
|
+ let info = [];
|
|
177
|
+ this.appStrategyInfo.groups.forEach((groupItem) => {
|
|
178
|
+ let groupTimes = {};
|
|
179
|
+ groupItem.times.forEach((timeItem) => {
|
|
180
|
+ if (!groupTimes[timeItem.week]) {
|
|
181
|
+ groupTimes[timeItem.week] = [];
|
|
182
|
+ }
|
|
183
|
+ groupTimes[timeItem.week].push(timeItem);
|
|
184
|
+ });
|
|
185
|
+ info.push(groupTimes);
|
|
186
|
+ });
|
|
187
|
+ return info;
|
156
|
188
|
}
|
157
|
189
|
},
|
158
|
190
|
methods: {
|
|
191
|
+ toEditeGroupItem(groupItem, groupIndex) {
|
|
192
|
+ this.tempStrategyInfo = JSON.parse(JSON.stringify(groupItem));
|
|
193
|
+ this.appStrategyInfo.groups.splice(groupIndex, 1);
|
|
194
|
+ },
|
|
195
|
+ toDelGroupItem(groupIndex) {
|
|
196
|
+ this.$Modal.confirm({
|
|
197
|
+ title: "提示",
|
|
198
|
+ content: "您确定删除选中数据吗?",
|
|
199
|
+ onOk: () => {
|
|
200
|
+ this.appStrategyInfo.groups.splice(groupIndex, 1);
|
|
201
|
+ },
|
|
202
|
+ onCancel: () => {}
|
|
203
|
+ });
|
|
204
|
+ },
|
159
|
205
|
appAllCheckChange(selected) {
|
160
|
206
|
if (selected) {
|
161
|
207
|
this.tempStrategyInfo.apps = this.appList.map(
|
|
@@ -207,6 +253,7 @@ export default {
|
207
|
253
|
return;
|
208
|
254
|
}
|
209
|
255
|
this.appStrategyInfo.groups.push(_tempStrategyInfo);
|
|
256
|
+ this.toResetStrategy();
|
210
|
257
|
}
|
211
|
258
|
}
|
212
|
259
|
};
|
|
@@ -378,13 +425,24 @@ export default {
|
378
|
425
|
cursor: pointer;
|
379
|
426
|
&:hover {
|
380
|
427
|
color: #339dff;
|
381
|
|
- }
|
382
|
|
- &.del {
|
383
|
|
- color: #f0153f;
|
|
428
|
+ &.del {
|
|
429
|
+ color: #f0153f;
|
|
430
|
+ }
|
384
|
431
|
}
|
385
|
432
|
}
|
386
|
433
|
}
|
387
|
434
|
}
|
|
435
|
+ .time_list {
|
|
436
|
+ display: flex;
|
|
437
|
+ justify-content: center;
|
|
438
|
+ align-items: center;
|
|
439
|
+ flex-wrap: wrap;
|
|
440
|
+ > span {
|
|
441
|
+ margin: 4px 6px;
|
|
442
|
+ line-height: 1;
|
|
443
|
+ white-space: nowrap;
|
|
444
|
+ }
|
|
445
|
+ }
|
388
|
446
|
.table_app_list {
|
389
|
447
|
display: flex;
|
390
|
448
|
justify-content: flex-start;
|
|
@@ -393,18 +451,25 @@ export default {
|
393
|
451
|
.table_app_item {
|
394
|
452
|
margin: 10px;
|
395
|
453
|
.app_top {
|
|
454
|
+ display: flex;
|
|
455
|
+ justify-content: center;
|
|
456
|
+ align-items: center;
|
396
|
457
|
margin: 0 auto;
|
397
|
458
|
width: 56px;
|
398
|
459
|
height: 56px;
|
399
|
460
|
border-radius: 6px;
|
400
|
461
|
border: 1px solid #e5e5e5;
|
401
|
462
|
background: #ffffff;
|
|
463
|
+ img {
|
|
464
|
+ width: 38px;
|
|
465
|
+ height: 38px;
|
|
466
|
+ }
|
402
|
467
|
}
|
403
|
468
|
.app_name {
|
404
|
469
|
margin-top: 10px;
|
405
|
470
|
max-width: 100px;
|
406
|
471
|
line-height: 1;
|
407
|
|
- font-size: 14px;
|
|
472
|
+ font-size: 12px;
|
408
|
473
|
text-align: center;
|
409
|
474
|
overflow: hidden;
|
410
|
475
|
text-overflow: ellipsis;
|