Переглянути джерело

给首页新增日历,修改用车申请表

余思翰 1 рік тому
джерело
коміт
6e30eddb36

+ 10
- 0
oa-ui/src/api/system/post.js Переглянути файл

@@ -50,3 +50,13 @@ export function delPost(postId) {
50 50
     method: 'delete'
51 51
   })
52 52
 }
53
+
54
+
55
+// 查询当前用户的部门负责人
56
+export function getUsersDeptLeader(query) {
57
+  return request({
58
+    url: '/system/post/deptLeader',
59
+    method: 'get',
60
+    params: query
61
+  })
62
+}

+ 557
- 0
oa-ui/src/components/Calendar/index.vue Переглянути файл

@@ -0,0 +1,557 @@
1
+<!--
2
+ * @Author: ysh
3
+ * @Date: 2024-03-07 10:00:26
4
+ * @LastEditors: Please set LastEditors
5
+ * @LastEditTime: 2024-03-07 10:14:41
6
+-->
7
+
8
+<template>
9
+  <div class="contianer">
10
+    <div class="calendar">
11
+      <div class="calendar-header">
12
+        <span class="month-picker" id="month-picker"> May </span>
13
+        <div class="year-picker" id="year-picker">
14
+          <span class="year-change" id="pre-year">
15
+            <pre><</pre>
16
+          </span>
17
+          <span id="year">2020 </span>
18
+          <span class="year-change" id="next-year">
19
+            <pre>></pre>
20
+          </span>
21
+        </div>
22
+      </div>
23
+
24
+      <div class="calendar-body">
25
+        <div class="calendar-week-days">
26
+          <div>Sun</div>
27
+          <div>Mon</div>
28
+          <div>Tue</div>
29
+          <div>Wed</div>
30
+          <div>Thu</div>
31
+          <div>Fri</div>
32
+          <div>Sat</div>
33
+        </div>
34
+        <div class="calendar-days">
35
+        </div>
36
+      </div>
37
+      <div class="calendar-footer">
38
+      </div>
39
+      <div class="date-time-formate">
40
+        <div class="day-text-formate">TODAY</div>
41
+        <div class="date-time-value">
42
+          <div class="time-formate">02:51:20</div>
43
+          <div class="date-formate">23 - july - 2022</div>
44
+        </div>
45
+      </div>
46
+      <div class="month-list"></div>
47
+    </div>
48
+  </div>
49
+</template>
50
+
51
+<script>
52
+export default {
53
+  name: 'Calendar',
54
+  mounted() {
55
+    this.initCalendar();
56
+  },
57
+  methods: {
58
+    initCalendar() {
59
+      const isLeapYear = (year) => {
60
+        return (
61
+          (year % 4 === 0 && year % 100 !== 0 && year % 400 !== 0) ||
62
+          (year % 100 === 0 && year % 400 === 0)
63
+        );
64
+      };
65
+      const getFebDays = (year) => {
66
+        return isLeapYear(year) ? 29 : 28;
67
+      };
68
+      let calendar = document.querySelector('.calendar');
69
+      const month_names = [
70
+        'January',
71
+        'February',
72
+        'March',
73
+        'April',
74
+        'May',
75
+        'June',
76
+        'July',
77
+        'August',
78
+        'September',
79
+        'October',
80
+        'November',
81
+        'December',
82
+      ];
83
+      let month_picker = document.querySelector('#month-picker');
84
+      const dayTextFormate = document.querySelector('.day-text-formate');
85
+      const timeFormate = document.querySelector('.time-formate');
86
+      const dateFormate = document.querySelector('.date-formate');
87
+
88
+      month_picker.onclick = () => {
89
+        month_list.classList.remove('hideonce');
90
+        month_list.classList.remove('hide');
91
+        month_list.classList.add('show');
92
+        dayTextFormate.classList.remove('showtime');
93
+        dayTextFormate.classList.add('hidetime');
94
+        timeFormate.classList.remove('showtime');
95
+        timeFormate.classList.add('hideTime');
96
+        dateFormate.classList.remove('showtime');
97
+        dateFormate.classList.add('hideTime');
98
+      };
99
+
100
+      const generateCalendar = (month, year) => {
101
+        let calendar_days = document.querySelector('.calendar-days');
102
+        calendar_days.innerHTML = '';
103
+        let calendar_header_year = document.querySelector('#year');
104
+        let days_of_month = [
105
+          31,
106
+          getFebDays(year),
107
+          31,
108
+          30,
109
+          31,
110
+          30,
111
+          31,
112
+          31,
113
+          30,
114
+          31,
115
+          30,
116
+          31,
117
+        ];
118
+
119
+        let currentDate = new Date();
120
+
121
+        month_picker.innerHTML = month_names[month];
122
+
123
+        calendar_header_year.innerHTML = year;
124
+
125
+        let first_day = new Date(year, month);
126
+
127
+
128
+        for (let i = 0; i <= days_of_month[month] + first_day.getDay() - 1; i++) {
129
+
130
+          let day = document.createElement('div');
131
+
132
+          if (i >= first_day.getDay()) {
133
+            day.innerHTML = i - first_day.getDay() + 1;
134
+
135
+            if (i - first_day.getDay() + 1 === currentDate.getDate() &&
136
+              year === currentDate.getFullYear() &&
137
+              month === currentDate.getMonth()
138
+            ) {
139
+              day.classList.add('current-date');
140
+            }
141
+          }
142
+          calendar_days.appendChild(day);
143
+        }
144
+      };
145
+
146
+      let month_list = calendar.querySelector('.month-list');
147
+      month_names.forEach((e, index) => {
148
+        let month = document.createElement('div');
149
+        month.innerHTML = `<div>${e}</div>`;
150
+
151
+        month_list.append(month);
152
+        month.onclick = () => {
153
+          currentMonth.value = index;
154
+          generateCalendar(currentMonth.value, currentYear.value);
155
+          month_list.classList.replace('show', 'hide');
156
+          dayTextFormate.classList.remove('hideTime');
157
+          dayTextFormate.classList.add('showtime');
158
+          timeFormate.classList.remove('hideTime');
159
+          timeFormate.classList.add('showtime');
160
+          dateFormate.classList.remove('hideTime');
161
+          dateFormate.classList.add('showtime');
162
+        };
163
+      });
164
+
165
+      (function () {
166
+        month_list.classList.add('hideonce');
167
+      })();
168
+      document.querySelector('#pre-year').onclick = () => {
169
+        --currentYear.value;
170
+        generateCalendar(currentMonth.value, currentYear.value);
171
+      };
172
+      document.querySelector('#next-year').onclick = () => {
173
+        ++currentYear.value;
174
+        generateCalendar(currentMonth.value, currentYear.value);
175
+      };
176
+
177
+      let currentDate = new Date();
178
+      let currentMonth = { value: currentDate.getMonth() };
179
+      let currentYear = { value: currentDate.getFullYear() };
180
+      generateCalendar(currentMonth.value, currentYear.value);
181
+
182
+      const todayShowTime = document.querySelector('.time-formate');
183
+      const todayShowDate = document.querySelector('.date-formate');
184
+
185
+      const currshowDate = new Date();
186
+      const showCurrentDateOption = {
187
+        year: 'numeric',
188
+        month: 'long',
189
+        day: 'numeric',
190
+        weekday: 'long',
191
+      };
192
+      const currentDateFormate = new Intl.DateTimeFormat(
193
+        'en-US',
194
+        showCurrentDateOption
195
+      ).format(currshowDate);
196
+      todayShowDate.textContent = currentDateFormate;
197
+      setInterval(() => {
198
+        const timer = new Date();
199
+        const option = {
200
+          hour: 'numeric',
201
+          minute: 'numeric',
202
+          second: 'numeric',
203
+        };
204
+        const formateTimer = new Intl.DateTimeFormat('en-us', option).format(timer);
205
+        let time = `${`${timer.getHours()}`.padStart(
206
+          2,
207
+          '0'
208
+        )}:${`${timer.getMinutes()}`.padStart(
209
+          2,
210
+          '0'
211
+        )}: ${`${timer.getSeconds()}`.padStart(2, '0')}`;
212
+        todayShowTime.textContent = formateTimer;
213
+      }, 1000);
214
+
215
+    }
216
+  },
217
+}
218
+</script>
219
+
220
+<style lang="scss">
221
+:root {
222
+  --dark-text: #f8fbff;
223
+  --light-body: #f3f8fe;
224
+  --light-main: #fdfdfd;
225
+  --light-second: #c3c2c8;
226
+  --light-hover: #f0f0f0;
227
+  --light-text: #151426;
228
+  --light-btn: #9796f0;
229
+  --blue: #0000ff;
230
+  --white: #fff;
231
+  --shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
232
+  --font-family: consolas;
233
+}
234
+
235
+
236
+.contianer {
237
+  width: max-content;
238
+  height: max-content;
239
+  position: relative;
240
+  display: flex;
241
+  padding: 2% 0px 0px 0px;
242
+  justify-content: center;
243
+  top: 10%;
244
+  right: 0%;
245
+  width: 100%;
246
+  height: 100%;
247
+}
248
+
249
+.calendar {
250
+  // height: 610px;
251
+  width: max-content;
252
+  background-color: white;
253
+  border-radius: 25px;
254
+  overflow: hidden;
255
+  padding: 30px 50px 0px 50px;
256
+}
257
+
258
+.calendar {
259
+  box-shadow: var(--shadow);
260
+}
261
+
262
+.calendar-header {
263
+  background: #9796f0;
264
+  display: flex;
265
+  justify-content: space-between;
266
+  align-items: center;
267
+  font-weight: 700;
268
+  color: var(--white);
269
+  padding: 10px;
270
+}
271
+
272
+.calendar-body {
273
+  pad: 10px;
274
+}
275
+
276
+.calendar-week-days {
277
+  display: grid;
278
+  grid-template-columns: repeat(7, 1fr);
279
+  font-weight: 600;
280
+  cursor: pointer;
281
+  color: rgb(104, 104, 104);
282
+}
283
+
284
+.calendar-week-days div:hover {
285
+  color: black;
286
+  transform: scale(1.2);
287
+  transition: all .2s ease-in-out;
288
+}
289
+
290
+.calendar-week-days div {
291
+  display: grid;
292
+  place-items: center;
293
+  color: var(--bg-second);
294
+  height: 50px;
295
+}
296
+
297
+.calendar-days {
298
+  display: grid;
299
+  grid-template-columns: repeat(7, 1fr);
300
+  gap: 2px;
301
+  color: var(--color-txt);
302
+}
303
+
304
+.calendar-days div {
305
+  width: 37px;
306
+  height: 33px;
307
+  display: flex;
308
+  align-items: center;
309
+  justify-content: center;
310
+  padding: 5px;
311
+  position: relative;
312
+  cursor: pointer;
313
+  animation: to-top 1s forwards;
314
+}
315
+
316
+.month-picker {
317
+  padding: 5px 10px;
318
+  border-radius: 10px;
319
+  cursor: pointer;
320
+}
321
+
322
+.month-picker:hover {
323
+  background-color: var(--color-hover);
324
+}
325
+
326
+.month-picker:hover {
327
+  color: var(--color-txt);
328
+}
329
+
330
+.year-picker {
331
+  display: flex;
332
+  align-items: center;
333
+}
334
+
335
+.year-change {
336
+  height: 30px;
337
+  width: 30px;
338
+  border-radius: 50%;
339
+  display: grid;
340
+  place-items: center;
341
+  margin: 0px 10px;
342
+  cursor: pointer;
343
+}
344
+
345
+.year-change:hover {
346
+  background-color: var(--light-btn);
347
+  transition: all .2s ease-in-out;
348
+  transform: scale(1.12);
349
+}
350
+
351
+.year-change:hover pre {
352
+  color: var(--bg-body);
353
+}
354
+
355
+.calendar-footer {
356
+  padding: 10px;
357
+  display: flex;
358
+  justify-content: flex-end;
359
+  align-items: center;
360
+}
361
+
362
+#year:hover {
363
+  cursor: pointer;
364
+  transform: scale(1.2);
365
+  transition: all 0.2 ease-in-out;
366
+}
367
+
368
+.calendar-days div span {
369
+  position: absolute;
370
+}
371
+
372
+.calendar-days div:hover {
373
+  transition: width 0.2s ease-in-out, height 0.2s ease-in-out;
374
+  background-color: #fbc7d4;
375
+  border-radius: 20%;
376
+  color: var(--dark-text);
377
+}
378
+
379
+.calendar-days div.current-date {
380
+  color: var(--dark-text);
381
+  background-color: var(--light-btn);
382
+  border-radius: 20%;
383
+}
384
+
385
+.month-list {
386
+  position: relative;
387
+  left: 0;
388
+  top: -50px;
389
+  background-color: #ebebeb;
390
+  color: var(--light-text);
391
+  display: grid;
392
+  grid-template-columns: repeat(3, auto);
393
+  gap: 5px;
394
+  border-radius: 20px;
395
+}
396
+
397
+.month-list>div {
398
+  display: grid;
399
+  place-content: center;
400
+  margin: 5px 10px;
401
+  transition: all 0.2s ease-in-out;
402
+}
403
+
404
+.month-list>div>div {
405
+  border-radius: 15px;
406
+  padding: 10px;
407
+  cursor: pointer;
408
+}
409
+
410
+.month-list>div>div:hover {
411
+  background-color: var(--light-btn);
412
+  color: var(--dark-text);
413
+  transform: scale(0.9);
414
+  transition: all 0.2s ease-in-out;
415
+}
416
+
417
+.month-list.show {
418
+  visibility: visible;
419
+  pointer-events: visible;
420
+  transition: 0.6s ease-in-out;
421
+  animation: to-left .71s forwards;
422
+}
423
+
424
+.month-list.hideonce {
425
+  visibility: hidden;
426
+}
427
+
428
+.month-list.hide {
429
+  animation: to-right 1s forwards;
430
+  visibility: none;
431
+  pointer-events: none;
432
+}
433
+
434
+.date-time-formate {
435
+  width: max-content;
436
+  height: max-content;
437
+  font-family: Dubai Light, Century Gothic;
438
+  position: relative;
439
+  display: inline;
440
+  top: 140px;
441
+  justify-content: center;
442
+}
443
+
444
+.day-text-formate {
445
+  font-family: Microsoft JhengHei UI;
446
+  font-size: 1.4rem;
447
+  padding-right: 5%;
448
+  border-right: 3px solid #9796f0;
449
+  position: absolute;
450
+  left: -1rem;
451
+}
452
+
453
+.date-time-value {
454
+  display: block;
455
+  height: max-content;
456
+  width: max-content;
457
+  position: relative;
458
+  left: 40%;
459
+  top: -18px;
460
+  text-align: center;
461
+}
462
+
463
+.time-formate {
464
+  font-size: 1.5rem;
465
+}
466
+
467
+.time-formate.hideTime {
468
+  animation: hidetime 1.5s forwards;
469
+}
470
+
471
+.day-text-formate.hidetime {
472
+  animation: hidetime 1.5s forwards;
473
+}
474
+
475
+.date-formate.hideTime {
476
+  animation: hidetime 1.5s forwards;
477
+}
478
+
479
+.day-text-formate.showtime {
480
+  animation: showtime 1s forwards;
481
+}
482
+
483
+.time-formate.showtime {
484
+  animation: showtime 1s forwards;
485
+}
486
+
487
+.date-formate.showtime {
488
+  animation: showtime 1s forwards;
489
+}
490
+
491
+@keyframes to-top {
492
+  0% {
493
+    transform: translateY(0);
494
+    opacity: 0;
495
+  }
496
+
497
+  100% {
498
+    transform: translateY(100%);
499
+    opacity: 1;
500
+  }
501
+}
502
+
503
+@keyframes to-left {
504
+  0% {
505
+    transform: translatex(230%);
506
+    opacity: 1;
507
+  }
508
+
509
+  100% {
510
+    transform: translatex(0);
511
+    opacity: 1;
512
+  }
513
+}
514
+
515
+@keyframes to-right {
516
+  10% {
517
+    transform: translatex(0);
518
+    opacity: 1;
519
+  }
520
+
521
+  100% {
522
+    transform: translatex(-150%);
523
+    opacity: 1;
524
+  }
525
+}
526
+
527
+@keyframes showtime {
528
+  0% {
529
+    transform: translatex(250%);
530
+    opacity: 1;
531
+  }
532
+
533
+  100% {
534
+    transform: translatex(0%);
535
+    opacity: 1;
536
+  }
537
+}
538
+
539
+@keyframes hidetime {
540
+  0% {
541
+    transform: translatex(0%);
542
+    opacity: 1;
543
+  }
544
+
545
+  100% {
546
+    transform: translatex(-370%);
547
+    opacity: 1;
548
+  }
549
+}
550
+
551
+@media (max-width:375px) {
552
+  .month-list>div {
553
+
554
+    margin: 5px 0px;
555
+  }
556
+}
557
+</style>

+ 87
- 39
oa-ui/src/views/flowable/form/carForm.vue Переглянути файл

@@ -1,8 +1,14 @@
1
+<!--
2
+ * @Author: ysh
3
+ * @Date: 2024-02-29 11:44:28
4
+ * @LastEditors: Please set LastEditors
5
+ * @LastEditTime: 2024-03-07 17:25:40
6
+-->
1 7
 <!--
2 8
  * @Author: wrh
3 9
  * @Date: 2024-02-29 17:24:39
4 10
  * @LastEditors: Please set LastEditors
5
- * @LastEditTime: 2024-03-06 17:24:51
11
+ * @LastEditTime: 2024-03-07 13:43:50
6 12
 -->
7 13
 
8 14
 <template>
@@ -30,27 +36,6 @@
30 36
             </el-form-item>
31 37
           </el-col>
32 38
         </el-row>
33
-        <el-row>
34
-          <el-col :span="6" :xs="24">
35
-            <el-form-item label="开始日期:">
36
-              <el-date-picker style="width:140px;" v-model="form.startTime" value-format="yyyy-MM-dd" type="date"
37
-                placeholder="选择日期" @change="calculateDay">
38
-              </el-date-picker>
39
-            </el-form-item>
40
-          </el-col>
41
-          <el-col :span="6" :xs="24">
42
-            <el-form-item label="结束日期:">
43
-              <el-date-picker style="width:140px;" v-model="form.endTime" value-format="yyyy-MM-dd" type="date"
44
-                placeholder="选择日期" @change="calculateDay">
45
-              </el-date-picker>
46
-            </el-form-item>
47
-          </el-col>
48
-          <el-col :span="8" :xs="24">
49
-            <el-form-item label="共计:">
50
-              {{ form.day + '天' }}
51
-            </el-form-item>
52
-          </el-col>
53
-        </el-row>
54 39
         <el-form-item label="项目编号:" prop="projectNumber">
55 40
           <el-select v-model="form.projectNumber" filterable placeholder="请选择" @change="handleSelectProject" clearable>
56 41
             <el-option v-for="item in projectList" :key="item.value" :label="item.projectNumber"
@@ -71,21 +56,58 @@
71 56
               }}</el-descriptions-item>
72 57
           </el-descriptions>
73 58
         </el-form-item>
59
+        <el-form-item label="乘车人数:" prop="passengers">
60
+          <el-input-number v-model="form.passengers" :min="1"></el-input-number>
61
+        </el-form-item>
62
+        <el-form-item label="用车事由:" prop="applyReason">
63
+          <el-input type="textarea" :rows="2" placeholder="请输入用车事由" v-model="form.applyReason">
64
+          </el-input>
65
+        </el-form-item>
66
+        <el-row>
67
+          <el-col :span="6" :xs="24">
68
+            <el-form-item label="开始日期:">
69
+              <el-date-picker style="width:140px;" v-model="form.beginDate" value-format="yyyy-MM-dd" type="date"
70
+                placeholder="选择日期" @change="calculateDay">
71
+              </el-date-picker>
72
+            </el-form-item>
73
+          </el-col>
74
+          <el-col :span="6" :xs="24">
75
+            <el-form-item label="结束日期:">
76
+              <el-date-picker style="width:140px;" v-model="form.endDate" value-format="yyyy-MM-dd" type="date"
77
+                placeholder="选择日期" @change="calculateDay">
78
+              </el-date-picker>
79
+            </el-form-item>
80
+          </el-col>
81
+          <el-col :span="8" :xs="24">
82
+            <el-form-item label="共计:">
83
+              {{ form.days + '天' }}
84
+            </el-form-item>
85
+          </el-col>
86
+        </el-row>
74 87
         <el-divider></el-divider>
88
+        <!-- 部门审核意见 -->
89
+        <el-form-item label="部门审核意见:" prop="deptComment" label-width="120px" v-if="taskName == '部门审核'">
90
+          <el-input type="textarea" :rows="2" placeholder="请输入部门审核意见" v-model="form.deptComment">
91
+          </el-input>
92
+        </el-form-item>
93
+        <!-- 分管审核意见 -->
94
+        <el-form-item label="分管审核意见:" prop="managerComment" label-width="120px" v-if="taskName == '分管审核'">
95
+          <el-input type="textarea" :rows="2" placeholder="请输入分管审核意见" v-model="form.managerComment">
96
+          </el-input>
97
+        </el-form-item>
75 98
         <!-- 综合事务部管理人员填写 -->
76
-
77
-        <el-form-item label="车牌号:"  v-if="taskName != '用车申请'">
99
+        <el-form-item label="车牌号:" v-if="taskName == '安排用车'">
78 100
           <el-select v-model="form.licensePlate" filterable multiple placeholder="请选择" clearable>
79 101
             <el-option v-for="item in carList" :key="item.id" :label="item.licensePlate" :value="item.id">
80 102
             </el-option>
81 103
           </el-select>
82 104
         </el-form-item>
83
-        <el-form-item label="驾驶员:"  v-if="taskName != '用车申请'">
84
-          <!-- <el-select v-model="form.driver" filterable multiple placeholder="请选择" clearable>
105
+        <el-form-item label="驾驶员:" v-if="taskName == '安排用车'">
106
+          <!-- <el-select v-model="form.drivers" filterable multiple placeholder="请选择" clearable>
85 107
             <el-option v-for="item in driverList" :key="item.userId" :label="item.nickName" :value="item.userId">
86 108
             </el-option>
87 109
           </el-select> -->
88
-          <el-checkbox-group v-model="form.driver">
110
+          <el-checkbox-group v-model="form.drivers">
89 111
             <el-checkbox :label="item.userId" v-for="item in driverList">{{ item.nickName }}</el-checkbox>
90 112
           </el-checkbox-group>
91 113
         </el-form-item>
@@ -101,11 +123,19 @@
101 123
 import { listProject, getProject } from "@/api/oa/project/project";
102 124
 import { listCar } from "@/api/oa/car/car";
103 125
 import { listDriver } from "@/api/system/post";
126
+import {
127
+  complete, rejectTask, returnList, returnTask, getNextFlowNode, delegate, flowTaskForm,
128
+} from "@/api/flowable/todo";
129
+import { getUsersDeptLeader } from '@/api/system/post.js'
104 130
 export default {
105 131
   props: {
106 132
     taskName: {
107 133
       type: String,
108 134
       required: true
135
+    },
136
+    taskForm: {
137
+      type: Object,
138
+      required: true
109 139
     }
110 140
   },
111 141
   created() {
@@ -119,19 +149,37 @@ export default {
119 149
     return {
120 150
       form: {
121 151
         date: new Date(),
122
-        day: '',
123
-        driver: []
152
+        days: '',
153
+        drivers: []
124 154
       },
125 155
       projectList: [],
126 156
       carList: [],
127 157
       driverList: [],
128 158
       chooseProject: {},
129
-      isSelect: false
159
+      isSelect: false,
130 160
     }
131 161
   },
132 162
   methods: {
133
-    submit(){
134
-      this.$emit('submit',form)
163
+    submit() {
164
+      let formData = new FormData();
165
+      let jsonForm = JSON.stringify(this.form);
166
+      formData.append("form", jsonForm);
167
+      const params = { taskId: this.taskForm.taskId }
168
+      // 获取下一个流程节点
169
+      getNextFlowNode(params).then(res => {
170
+        const data = res.data;
171
+        debugger
172
+        this.taskForm.formData = formData;
173
+        complete(this.taskForm).then(response => {
174
+          this.$modal.msgSuccess(response.msg);
175
+          this.goBack();
176
+        });
177
+      })
178
+    },
179
+    // 获取下一个审批人
180
+    getNextFlowNodeApproval() {
181
+      getUsersDeptLeader()
182
+      this.$set(this.taskForm.variables, "approval", selectVal.join(','));
135 183
     },
136 184
     // 查询项目列表
137 185
     getProjectList() {
@@ -175,18 +223,18 @@ export default {
175 223
       })
176 224
     },
177 225
     calculateDay() {
178
-      if (this.form.startTime && this.form.endTime) {
179
-        let y1 = new Date(this.form.startTime);
180
-        let y2 = new Date(this.form.endTime);
226
+      if (this.form.beginDate && this.form.endDate) {
227
+        let y1 = new Date(this.form.beginDate);
228
+        let y2 = new Date(this.form.endDate);
181 229
         if (y2 < y1) {
182
-          this.form.day = '';
230
+          this.form.days = '';
183 231
           return
184 232
         }
185 233
         let sub = Math.abs(y2 - y1);
186
-        let day = Math.floor(sub / (1000 * 60 * 60 * 24)) + 1;
187
-        this.form.day = day;
234
+        let days = Math.floor(sub / (1000 * 60 * 60 * 24)) + 1;
235
+        this.form.days = days;
188 236
       } else {
189
-        this.form.day = '';
237
+        this.form.days = '';
190 238
       }
191 239
 
192 240
     }

+ 174
- 0
oa-ui/src/views/flowable/form/deviceForm.vue Переглянути файл

@@ -0,0 +1,174 @@
1
+<!--
2
+ * @Author: ysh
3
+ * @Date: 2024-03-07 13:44:39
4
+ * @LastEditors: Please set LastEditors
5
+ * @LastEditTime: 2024-03-07 14:26:46
6
+-->
7
+
8
+<template>
9
+  <div>
10
+    <h2 style="text-align: center;">设备申请表</h2>
11
+    <div>
12
+      <el-form :model="form" label-width="100px">
13
+        <!-- 申请人填写 -->
14
+        <el-row :gutter="20">
15
+          <el-col :span="6" :xs="24">
16
+            <el-form-item label="申请人:" prop="user">
17
+              <el-input v-model="form.user"></el-input>
18
+            </el-form-item>
19
+          </el-col>
20
+          <el-col :span="6" :xs="24">
21
+            <el-form-item label="所在部门:" prop="deptName">
22
+              <el-input v-model="form.deptName"></el-input>
23
+            </el-form-item>
24
+          </el-col>
25
+          <el-col :span="6" :xs="24">
26
+            <el-form-item label="申请时间:" prop="date">
27
+              <el-date-picker style="width:140px;" v-model="form.date" value-format="yyyy-MM-dd" type="date"
28
+                placeholder="选择日期">
29
+              </el-date-picker>
30
+            </el-form-item>
31
+          </el-col>
32
+        </el-row>
33
+        <el-form-item label="项目编号:" prop="projectNumber">
34
+          <el-select v-model="form.projectNumber" filterable allow-create placeholder="请选择"
35
+            @change="handleSelectProject" clearable>
36
+            <el-option v-for="item in projectList" :key="item.value" :label="item.projectNumber"
37
+              :value="item.projectId">
38
+            </el-option>
39
+          </el-select>
40
+          <el-descriptions border v-if="isSelect" style="margin-top: 10px;" :column="1">
41
+            <el-descriptions-item label="项目编号" label-class-name="my-label">{{ chooseProject.projectNumber
42
+              }}</el-descriptions-item>
43
+            <el-descriptions-item label="项目名称" label-class-name="my-label">{{ chooseProject.projectName
44
+              }}</el-descriptions-item>
45
+            <el-descriptions-item label="项目负责人" label-class-name="my-label">{{ chooseProject.projectLeader
46
+              }}</el-descriptions-item>
47
+            <el-descriptions-item label="承担部门" label-class-name="my-label">
48
+              <el-tag size="small">{{ chooseProject.undertakingDept }}</el-tag>
49
+            </el-descriptions-item>
50
+            <el-descriptions-item label="项目类型" label-class-name="my-label">{{ chooseProject.projectType
51
+              }}</el-descriptions-item>
52
+          </el-descriptions>
53
+        </el-form-item>
54
+        <el-form-item label="申领事由:" prop="applyReason">
55
+          <el-input type="textarea" :rows="2" placeholder="请输入申领事由" v-model="form.applyReason">
56
+          </el-input>
57
+        </el-form-item>
58
+        <el-row>
59
+          <el-col :span="6" :xs="24">
60
+            <el-form-item label="开始日期:">
61
+              <el-date-picker style="width:140px;" v-model="form.beginDate" value-format="yyyy-MM-dd" type="date"
62
+                placeholder="选择日期" @change="calculateDay">
63
+              </el-date-picker>
64
+            </el-form-item>
65
+          </el-col>
66
+          <el-col :span="6" :xs="24">
67
+            <el-form-item label="结束日期:">
68
+              <el-date-picker style="width:140px;" v-model="form.endDate" value-format="yyyy-MM-dd" type="date"
69
+                placeholder="选择日期" @change="calculateDay">
70
+              </el-date-picker>
71
+            </el-form-item>
72
+          </el-col>
73
+          <el-col :span="8" :xs="24">
74
+            <el-form-item label="共计:">
75
+              {{ form.days + '天' }}
76
+            </el-form-item>
77
+          </el-col>
78
+        </el-row>
79
+        <el-divider></el-divider>
80
+
81
+        <!-- 部门审核意见 -->
82
+        <el-form-item label="部门审核意见:" prop="deptComment" label-width="120px" v-if="taskName == '部门审核'">
83
+          <el-input type="textarea" :rows="2" placeholder="请输入部门审核意见" v-model="form.deptComment">
84
+          </el-input>
85
+        </el-form-item>
86
+        <!-- 分管审核意见 -->
87
+        <el-form-item label="分管审核意见:" prop="managerComment" label-width="120px" v-if="taskName == '分管审核'">
88
+          <el-input type="textarea" :rows="2" placeholder="请输入分管审核意见" v-model="form.managerComment">
89
+          </el-input>
90
+        </el-form-item>
91
+      </el-form>
92
+      <el-row style="text-align: center;" v-if="taskName == '设备申请'">
93
+        <el-button type="primary" @click="submit">提交申请</el-button>
94
+      </el-row>
95
+    </div>
96
+  </div>
97
+</template>
98
+
99
+<script>
100
+import { listProject, getProject } from "@/api/oa/project/project";
101
+export default {
102
+  props: {
103
+    taskName: {
104
+      type: String,
105
+      required: true
106
+    },
107
+    taskForm: {
108
+      type: Object,
109
+      required: true
110
+    }
111
+  },
112
+  created() {
113
+    this.form.user = this.$store.getters.name;
114
+    this.form.deptName = this.$store.getters.deptName;
115
+    this.getProjectList();
116
+  },
117
+  data() {
118
+    return {
119
+      form: {
120
+        date: new Date(),
121
+        days: ""
122
+      },
123
+      projectList: [],
124
+      chooseProject: {},
125
+      isSelect: false
126
+    }
127
+  },
128
+  methods: {
129
+    submit() {
130
+
131
+    },
132
+    // 查询项目列表
133
+    getProjectList() {
134
+      this.loading = true
135
+      listProject({
136
+        pageNum: 1,
137
+        pageSize: 9999999999
138
+      }).then(response => {
139
+        this.projectList = response.rows;
140
+      })
141
+    },
142
+    // 选择项目
143
+    handleSelectProject(val) {
144
+      if (val != "" && val != undefined && val != null) {
145
+        getProject(val).then(res => {
146
+          this.chooseProject = res.data;
147
+          this.isSelect = true
148
+        })
149
+      } else {
150
+        this.isSelect = false
151
+      }
152
+    },
153
+    // 计算天数
154
+    calculateDay() {
155
+      if (this.form.beginDate && this.form.endDate) {
156
+        let y1 = new Date(this.form.beginDate);
157
+        let y2 = new Date(this.form.endDate);
158
+        if (y2 < y1) {
159
+          this.form.days = '';
160
+          return
161
+        }
162
+        let sub = Math.abs(y2 - y1);
163
+        let days = Math.floor(sub / (1000 * 60 * 60 * 24)) + 1;
164
+        this.form.days = days;
165
+      } else {
166
+        this.form.days = '';
167
+      }
168
+
169
+    }
170
+  },
171
+}
172
+</script>
173
+
174
+<style lang="scss" scoped></style>

+ 6
- 4
oa-ui/src/views/flowable/task/todo/detail/index.vue Переглянути файл

@@ -22,7 +22,8 @@
22 22
             v-else-if="taskForm.procDefName == '财务部考核'"></cw-table>
23 23
           <zh-table :tableForm="tableForm" :taskName="taskName" @submit="handleComplete"
24 24
             v-else-if="taskForm.procDefName == '综合事务部考核'"></zh-table>
25
-          <car-form :taskName="taskName" v-else-if="taskForm.procDefName == '用车审批'" @submit="handleComplete"></car-form>
25
+          <car-form :taskName="taskName" :taskForm="taskForm" v-else-if="taskForm.procDefName == '用车审批'"></car-form>
26
+          <device-form :taskName="taskName" :taskForm="taskForm" v-else-if="taskForm.procDefName == '设备审批'"></device-form>
26 27
           <el-row type="flex" justify="center" v-show="isShowApprove()">
27 28
             <el-button v-if="!formKeyExist" icon="el-icon-edit-outline" type="success" size="mini"
28 29
               @click="handleComplete">审核通过
@@ -163,6 +164,7 @@ import JsTable from "../../../form/jsTable.vue";
163 164
 import XmTable from "../../../form/xmTable.vue";
164 165
 import CwTable from "../../../form/cwTable.vue";
165 166
 import carForm from "../../../form/carForm.vue";
167
+import deviceForm from "../../../form/deviceForm";
166 168
 
167 169
 export default {
168 170
   name: "Record",
@@ -177,7 +179,8 @@ export default {
177 179
     XmTable,
178 180
     CwTable,
179 181
     JyTable,
180
-    carForm
182
+    carForm,
183
+    deviceForm
181 184
   },
182 185
   props: {},
183 186
   data() {
@@ -492,7 +495,6 @@ export default {
492 495
     /** 申请流程表单数据提交 */
493 496
     submitForm(formData, assessId) {
494 497
       listAssess({ assessId }).then(result => {
495
-
496 498
         let list = result;
497 499
         if (list.total != 0) {
498 500
           modifyAssess(formData).then(res => {
@@ -534,7 +536,7 @@ export default {
534 536
     },
535 537
     // 是否显示审批通过
536 538
     isShowApprove(){
537
-      if(this.taskName == '员工填报' || this.taskName == '用车申请'){
539
+      if(this.taskName == '员工填报' || this.taskName == '用车申请' || this.taskName == '设备申请'){
538 540
         return false
539 541
       }else{
540 542
         return true

+ 10
- 5
oa-ui/src/views/index.vue Переглянути файл

@@ -2,7 +2,7 @@
2 2
  * @Author: ysh
3 3
  * @Date: 2024-01-03 09:23:11
4 4
  * @LastEditors: Please set LastEditors
5
- * @LastEditTime: 2024-03-06 16:14:12
5
+ * @LastEditTime: 2024-03-07 10:13:48
6 6
 -->
7 7
 
8 8
 <template>
@@ -15,7 +15,7 @@
15 15
             <img :src="avatar" class="user-avatar" />
16 16
           </div>
17 17
           <div class="username">
18
-            {{  user.nickName }}
18
+            {{ user.nickName }}
19 19
           </div>
20 20
         </div>
21 21
       </el-col>
@@ -37,8 +37,9 @@
37 37
       <el-col :span="8">
38 38
         <div class="header">日历</div>
39 39
         <div class="calendar">
40
-          <el-calendar v-model="times">
41
-          </el-calendar>
40
+          <Calendar></Calendar>
41
+          <!-- <el-calendar v-model="times">
42
+          </el-calendar> -->
42 43
         </div>
43 44
       </el-col>
44 45
       <el-col></el-col>
@@ -53,7 +54,11 @@ import { getUserProfile } from "@/api/system/user";
53 54
 import { listProject } from "@/api/oa/project/project";
54 55
 import { todoList } from "@/api/flowable/todo";
55 56
 import { finishedList } from "@/api/flowable/finished";
57
+import Calendar from '@/components/Calendar'
56 58
 export default {
59
+  components: {
60
+    Calendar
61
+  },
57 62
   computed: {
58 63
     ...mapGetters(["avatar"]),
59 64
   },
@@ -272,7 +277,7 @@ export default {
272 277
 
273 278
 
274 279
 .calendar {
275
-  height: 300px;
280
+  // height: 300px;
276 281
 }
277 282
 
278 283
 ::v-deep .el-calendar-table .el-calendar-day {

Завантаження…
Відмінити
Зберегти