|
|
@@ -1,113 +1,10 @@
|
|
1
|
|
-<template>
|
|
2
|
|
- <el-drawer
|
|
3
|
|
- :model-value="isdrawer"
|
|
4
|
|
- @update:model-value="emit('update:modelValue', $event)"
|
|
5
|
|
- :title="isdrawertitle"
|
|
6
|
|
- direction="rtl"
|
|
7
|
|
- :close-on-click-modal="false"
|
|
8
|
|
- @close="handleClose"
|
|
9
|
|
- >
|
|
10
|
|
- <div v-loading="isdrawerloading" style="width: 100%; height: 100%">
|
|
11
|
|
- <el-form
|
|
12
|
|
- ref="ruleFormRef"
|
|
13
|
|
- style="max-width: 600px"
|
|
14
|
|
- :model="ruleForm"
|
|
15
|
|
- :rules="rules"
|
|
16
|
|
- label-width="auto"
|
|
17
|
|
- >
|
|
18
|
|
- <el-form-item label="班次名称" prop="name">
|
|
19
|
|
- <el-input v-model="ruleForm.name" placeholder="请输入班次名称" />
|
|
20
|
|
- </el-form-item>
|
|
21
|
|
- <div style="display: flex; justify-content: space-between; gap: 20px">
|
|
22
|
|
- <el-form-item label="第一次上班时间" prop="firstWorkTime">
|
|
23
|
|
- <el-date-picker
|
|
24
|
|
- v-model="ruleForm.firstWorkTime"
|
|
25
|
|
- type="datetime"
|
|
26
|
|
- placeholder="请选择"
|
|
27
|
|
- @change="calculateFirstWorkDuration"
|
|
28
|
|
- />
|
|
29
|
|
- </el-form-item>
|
|
30
|
|
- <el-form-item label="第一次下班时间" prop="lastWorkTime">
|
|
31
|
|
- <el-date-picker
|
|
32
|
|
- v-model="ruleForm.lastWorkTime"
|
|
33
|
|
- type="datetime"
|
|
34
|
|
- placeholder="请选择"
|
|
35
|
|
- @change="calculateFirstWorkDuration"
|
|
36
|
|
- />
|
|
37
|
|
- </el-form-item>
|
|
38
|
|
- </div>
|
|
39
|
|
- <el-form-item label="第一次上班时长" prop="firstWorkDuration">
|
|
40
|
|
- <el-input v-model="ruleForm.firstWorkDuration" disabled />
|
|
41
|
|
- </el-form-item>
|
|
42
|
|
- <div style="display: flex; justify-content: space-between; gap: 20px">
|
|
43
|
|
- <el-form-item label="第二次上班时间" prop="secondWorkTime">
|
|
44
|
|
- <el-date-picker
|
|
45
|
|
- v-model="ruleForm.secondWorkTime"
|
|
46
|
|
- type="datetime"
|
|
47
|
|
- placeholder="请选择"
|
|
48
|
|
- @change="calculateSecondWorkDuration"
|
|
49
|
|
- />
|
|
50
|
|
- </el-form-item>
|
|
51
|
|
- <el-form-item label="第二次下班时间" prop="secondLastWorkTime">
|
|
52
|
|
- <el-date-picker
|
|
53
|
|
- v-model="ruleForm.secondLastWorkTime"
|
|
54
|
|
- type="datetime"
|
|
55
|
|
- placeholder="请选择"
|
|
56
|
|
- @change="calculateSecondWorkDuration"
|
|
57
|
|
- />
|
|
58
|
|
- </el-form-item>
|
|
59
|
|
- </div>
|
|
60
|
|
- <el-form-item label="第二次上班时长" prop="secondWorkDuration">
|
|
61
|
|
- <el-input v-model="ruleForm.secondWorkDuration" disabled />
|
|
62
|
|
- </el-form-item>
|
|
63
|
|
- <el-form-item label="常用" prop="common">
|
|
64
|
|
- <el-radio-group v-model="ruleForm.common">
|
|
65
|
|
- <el-radio value="1" size="large">是</el-radio>
|
|
66
|
|
- <el-radio value="0" size="large">否</el-radio>
|
|
67
|
|
- </el-radio-group>
|
|
68
|
|
- </el-form-item>
|
|
69
|
|
- <el-form-item label="适用场站" prop="stationIds">
|
|
70
|
|
- <div style="display: flex; gap: 20px">
|
|
71
|
|
- <el-select
|
|
72
|
|
- v-model="ruleForm.stationIds"
|
|
73
|
|
- multiple
|
|
74
|
|
- placeholder="请选择"
|
|
75
|
|
- style="width: 240px"
|
|
76
|
|
- >
|
|
77
|
|
- <el-option
|
|
78
|
|
- v-for="item in options"
|
|
79
|
|
- :key="item.value"
|
|
80
|
|
- :label="item.label"
|
|
81
|
|
- :value="item.value"
|
|
82
|
|
- />
|
|
83
|
|
- </el-select>
|
|
84
|
|
- <el-button type="primary" @click="SelectAll"> 全选 </el-button>
|
|
85
|
|
- </div>
|
|
86
|
|
- </el-form-item>
|
|
87
|
|
- <el-form-item>
|
|
88
|
|
- <div
|
|
89
|
|
- style="
|
|
90
|
|
- width: 100%;
|
|
91
|
|
- display: flex;
|
|
92
|
|
- justify-content: flex-end;
|
|
93
|
|
- gap: 20px;
|
|
94
|
|
- "
|
|
95
|
|
- >
|
|
96
|
|
- <el-button type="primary" @click="submitForm(ruleFormRef)">
|
|
97
|
|
- 提交
|
|
98
|
|
- </el-button>
|
|
99
|
|
- <el-button @click="handleClose">取消</el-button>
|
|
100
|
|
- </div>
|
|
101
|
|
- </el-form-item>
|
|
102
|
|
- </el-form>
|
|
103
|
|
- </div>
|
|
104
|
|
- </el-drawer>
|
|
105
|
|
-</template>
|
|
106
|
|
-
|
|
107
|
1
|
<script lang="ts" setup>
|
|
108
|
|
-import { reactive, ref, onMounted, watch } from 'vue';
|
|
109
|
|
-import type { FormInstance, FormRules } from 'element-plus';
|
|
110
|
|
-import { selectAllSysStationAreaList } from '#/api/system/infoEntry/stationInfo/stationInfo';
|
|
|
2
|
+import type { FormInstance } from 'element-plus';
|
|
|
3
|
+
|
|
|
4
|
+import { onMounted, reactive, ref, watch } from 'vue';
|
|
|
5
|
+
|
|
|
6
|
+import { selectAllSysStation } from '#/api/system/infoEntry/stationInfo/stationInfo';
|
|
|
7
|
+
|
|
111
|
8
|
const props = defineProps({
|
|
112
|
9
|
isdrawer: {
|
|
113
|
10
|
type: Boolean,
|
|
|
@@ -164,8 +61,13 @@ const ruleFormRef = ref();
|
|
164
|
61
|
const options = ref([]) as any;
|
|
165
|
62
|
onMounted(async () => {
|
|
166
|
63
|
try {
|
|
167
|
|
- //@ts-ignore
|
|
168
|
|
- options.value = (await selectAllSysStationAreaList()).map((item) => ({
|
|
|
64
|
+ // @ts-ignore
|
|
|
65
|
+ options.value = (
|
|
|
66
|
+ await selectAllSysStation({
|
|
|
67
|
+ isAll: 1,
|
|
|
68
|
+ pageSize: 10_000,
|
|
|
69
|
+ })
|
|
|
70
|
+ ).map((item) => ({
|
|
169
|
71
|
value: item?.id,
|
|
170
|
72
|
label: item?.stationName,
|
|
171
|
73
|
}));
|
|
|
@@ -215,7 +117,7 @@ watch(
|
|
215
|
117
|
if (newEditData.applicableStations) {
|
|
216
|
118
|
ruleForm.value.stationIds = newEditData.applicableStations
|
|
217
|
119
|
.split(',')
|
|
218
|
|
- .map((id: any) => Number(id));
|
|
|
120
|
+ .map(Number);
|
|
219
|
121
|
}
|
|
220
|
122
|
}
|
|
221
|
123
|
},
|
|
|
@@ -255,10 +157,13 @@ const rules = reactive({
|
|
255
|
157
|
});
|
|
256
|
158
|
const SelectAll = async () => {
|
|
257
|
159
|
try {
|
|
258
|
|
- //@ts-ignore
|
|
259
|
|
- ruleForm.value.stationIds = (await selectAllSysStationAreaList()).map(
|
|
260
|
|
- (item: any) => item?.id,
|
|
261
|
|
- );
|
|
|
160
|
+ // @ts-ignore
|
|
|
161
|
+ ruleForm.value.stationIds = (
|
|
|
162
|
+ await selectAllSysStation({
|
|
|
163
|
+ isAll: 1,
|
|
|
164
|
+ pageSize: 10_000,
|
|
|
165
|
+ })
|
|
|
166
|
+ ).map((item: any) => item?.id);
|
|
262
|
167
|
} catch (error) {
|
|
263
|
168
|
console.log(error);
|
|
264
|
169
|
}
|
|
|
@@ -276,8 +181,8 @@ const submitForm = async (formEl: FormInstance | undefined) => {
|
|
276
|
181
|
|
|
277
|
182
|
// 计算工作时长
|
|
278
|
183
|
const calculateWorkDuration = (
|
|
279
|
|
- startTime: string | Date,
|
|
280
|
|
- endTime: string | Date,
|
|
|
184
|
+ startTime: Date | string,
|
|
|
185
|
+ endTime: Date | string,
|
|
281
|
186
|
): string => {
|
|
282
|
187
|
if (!startTime || !endTime) return '';
|
|
283
|
188
|
|
|
|
@@ -316,3 +221,109 @@ const calculateSecondWorkDuration = () => {
|
|
316
|
221
|
// formEl.resetFields();
|
|
317
|
222
|
// };
|
|
318
|
223
|
</script>
|
|
|
224
|
+
|
|
|
225
|
+<template>
|
|
|
226
|
+ <el-drawer
|
|
|
227
|
+ :model-value="isdrawer"
|
|
|
228
|
+ @update:model-value="emit('update:modelValue', $event)"
|
|
|
229
|
+ :title="isdrawertitle"
|
|
|
230
|
+ direction="rtl"
|
|
|
231
|
+ :close-on-click-modal="false"
|
|
|
232
|
+ @close="handleClose"
|
|
|
233
|
+ >
|
|
|
234
|
+ <div v-loading="isdrawerloading" style="width: 100%; height: 100%">
|
|
|
235
|
+ <el-form
|
|
|
236
|
+ ref="ruleFormRef"
|
|
|
237
|
+ style="max-width: 600px"
|
|
|
238
|
+ :model="ruleForm"
|
|
|
239
|
+ :rules="rules"
|
|
|
240
|
+ label-width="auto"
|
|
|
241
|
+ >
|
|
|
242
|
+ <el-form-item label="班次名称" prop="name">
|
|
|
243
|
+ <el-input v-model="ruleForm.name" placeholder="请输入班次名称" />
|
|
|
244
|
+ </el-form-item>
|
|
|
245
|
+ <div style="display: flex; justify-content: space-between; gap: 20px">
|
|
|
246
|
+ <el-form-item label="第一次上班时间" prop="firstWorkTime">
|
|
|
247
|
+ <el-date-picker
|
|
|
248
|
+ v-model="ruleForm.firstWorkTime"
|
|
|
249
|
+ type="datetime"
|
|
|
250
|
+ placeholder="请选择"
|
|
|
251
|
+ @change="calculateFirstWorkDuration"
|
|
|
252
|
+ />
|
|
|
253
|
+ </el-form-item>
|
|
|
254
|
+ <el-form-item label="第一次下班时间" prop="lastWorkTime">
|
|
|
255
|
+ <el-date-picker
|
|
|
256
|
+ v-model="ruleForm.lastWorkTime"
|
|
|
257
|
+ type="datetime"
|
|
|
258
|
+ placeholder="请选择"
|
|
|
259
|
+ @change="calculateFirstWorkDuration"
|
|
|
260
|
+ />
|
|
|
261
|
+ </el-form-item>
|
|
|
262
|
+ </div>
|
|
|
263
|
+ <el-form-item label="第一次上班时长" prop="firstWorkDuration">
|
|
|
264
|
+ <el-input v-model="ruleForm.firstWorkDuration" disabled />
|
|
|
265
|
+ </el-form-item>
|
|
|
266
|
+ <div style="display: flex; justify-content: space-between; gap: 20px">
|
|
|
267
|
+ <el-form-item label="第二次上班时间" prop="secondWorkTime">
|
|
|
268
|
+ <el-date-picker
|
|
|
269
|
+ v-model="ruleForm.secondWorkTime"
|
|
|
270
|
+ type="datetime"
|
|
|
271
|
+ placeholder="请选择"
|
|
|
272
|
+ @change="calculateSecondWorkDuration"
|
|
|
273
|
+ />
|
|
|
274
|
+ </el-form-item>
|
|
|
275
|
+ <el-form-item label="第二次下班时间" prop="secondLastWorkTime">
|
|
|
276
|
+ <el-date-picker
|
|
|
277
|
+ v-model="ruleForm.secondLastWorkTime"
|
|
|
278
|
+ type="datetime"
|
|
|
279
|
+ placeholder="请选择"
|
|
|
280
|
+ @change="calculateSecondWorkDuration"
|
|
|
281
|
+ />
|
|
|
282
|
+ </el-form-item>
|
|
|
283
|
+ </div>
|
|
|
284
|
+ <el-form-item label="第二次上班时长" prop="secondWorkDuration">
|
|
|
285
|
+ <el-input v-model="ruleForm.secondWorkDuration" disabled />
|
|
|
286
|
+ </el-form-item>
|
|
|
287
|
+ <el-form-item label="常用" prop="common">
|
|
|
288
|
+ <el-radio-group v-model="ruleForm.common">
|
|
|
289
|
+ <el-radio value="1" size="large">是</el-radio>
|
|
|
290
|
+ <el-radio value="0" size="large">否</el-radio>
|
|
|
291
|
+ </el-radio-group>
|
|
|
292
|
+ </el-form-item>
|
|
|
293
|
+ <el-form-item label="适用场站" prop="stationIds">
|
|
|
294
|
+ <div style="display: flex; gap: 20px">
|
|
|
295
|
+ <el-select
|
|
|
296
|
+ v-model="ruleForm.stationIds"
|
|
|
297
|
+ multiple
|
|
|
298
|
+ placeholder="请选择"
|
|
|
299
|
+ style="width: 240px"
|
|
|
300
|
+ >
|
|
|
301
|
+ <el-option
|
|
|
302
|
+ v-for="item in options"
|
|
|
303
|
+ :key="item.value"
|
|
|
304
|
+ :label="item.label"
|
|
|
305
|
+ :value="item.value"
|
|
|
306
|
+ />
|
|
|
307
|
+ </el-select>
|
|
|
308
|
+ <el-button type="primary" @click="SelectAll"> 全选 </el-button>
|
|
|
309
|
+ </div>
|
|
|
310
|
+ </el-form-item>
|
|
|
311
|
+ <el-form-item>
|
|
|
312
|
+ <div
|
|
|
313
|
+ style="
|
|
|
314
|
+ width: 100%;
|
|
|
315
|
+ display: flex;
|
|
|
316
|
+ justify-content: flex-end;
|
|
|
317
|
+ gap: 20px;
|
|
|
318
|
+ "
|
|
|
319
|
+ >
|
|
|
320
|
+ <el-button type="primary" @click="submitForm(ruleFormRef)">
|
|
|
321
|
+ 提交
|
|
|
322
|
+ </el-button>
|
|
|
323
|
+ <el-button @click="handleClose">取消</el-button>
|
|
|
324
|
+ </div>
|
|
|
325
|
+ </el-form-item>
|
|
|
326
|
+ </el-form>
|
|
|
327
|
+ </div>
|
|
|
328
|
+ </el-drawer>
|
|
|
329
|
+</template>
|