加班管理

2024-11-07 18:59:48 +08:00 · 2024-11-07 18:58:43 +08:00 · 2024-11-07 16:25:41 +08:00 · 2024-11-07 15:52:39 +08:00
4 changed files with 194 additions and 107 deletions
--- a/src/views/Home/bgyp/BgypCreate.vue
+++ b/src/views/Home/bgyp/BgypCreate.vue
@ -42,16 +42,16 @@
          </el-col>
        </el-row>
        <el-row>
-          <el-col :span="12">
-            <el-form-item label="物品名字" prop="usageName">
-              <el-input v-model="formData.usageName" placeholder="请输入申请物品名字" />
-            </el-form-item>
-          </el-col>
          <el-col :span="12">
            <el-form-item label="物品数量" prop="usageQuantity">
              <el-input v-model.number="formData.usageQuantity" placeholder="请输入申请物品数量" />
            </el-form-item>
+<!--            <el-form-item label="物品名字" prop="usageName">-->
+<!--              <el-input v-model="formData.usageName" placeholder="请输入申请物品名字" />-->
+<!--            </el-form-item>-->
          </el-col>
+<!--          <el-col :span="12">-->
+<!--          </el-col>-->
        </el-row>
        <el-row>
          <el-col :span="12">
--- a/src/views/Home/clgl/ClglCreate.vue
+++ b/src/views/Home/clgl/ClglCreate.vue
@ -43,6 +43,7 @@
              type="date"
              value-format="x"
              placeholder="选择用车开始时间"
+              @change="validateDate"
            />
          </el-form-item>
        </el-col>
@ -53,6 +54,7 @@
              type="date"
              value-format="x"
              placeholder="选择用车结束时间"
+              @change="validateDate"
            />
          </el-form-item>
        </el-col>
@ -150,6 +152,17 @@ const formData = ref({
  carReason: undefined,
  carRemark: undefined,
 })
+// 方法：验证开始时间是否小于结束时间
+const validateDate = () => {
+  if (formData.value.carStart && formData.value.carEnd) {
+    const start = formData.value.carStart
+    const end = formData.value.carEnd
+    if (start > end) {
+      formData.value.carEnd = undefined
+      message.error('开始时间不能大于结束时间')
+    }
+  }
+}
 const formRules = reactive({
  carType: [{ required: true, message: '车辆类型不能为空', trigger: 'change' }],
  carDriver: [{ required: true, message: '驾驶员不能为空', trigger: 'blur' }],
--- a/src/views/Home/jbgl/JbglCreate.vue
+++ b/src/views/Home/jbgl/JbglCreate.vue
@ -10,54 +10,80 @@
        label-width="100px"
        v-loading="formLoading"
      >
-        <el-form-item label="申请标题" prop="title">
-          <el-input v-model="formData.title" placeholder="请输入申请标题" />
-        </el-form-item>
-        <el-form-item label="申请人名字" prop="userName">
-          <div class="pull-left" v-show="true" v-if="userInfo">{{ userInfo}} </div>
-          <div class="pull-left" v-show="true" v-if="!userInfo">获取失败 </div>
-        </el-form-item>
-        <el-form-item label="申请部门名字" prop="deptName">
-          <div class="pull-left" v-show="true" v-if="deptInfo">{{ deptInfo}} </div>
-          <div class="pull-left" v-show="true" v-if="!deptInfo">获取失败 </div>
-        </el-form-item>
-        <el-form-item label="申请时间" prop="usageDate">
-          <el-date-picker
-            v-model="formData.usageDate"
-            type="date"
-            value-format="x"
-            placeholder="选择申请时间"
-          />
-        </el-form-item>
-        <el-form-item label="加班类型" prop="type">
-          <el-select v-model="formData.type" placeholder="请选择加班类型">
-            <el-option
-              v-for="dict in getIntDictOptions(DICT_TYPE.JBGL_TYPE)"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="加班开始时间" prop="startDate">
-          <el-date-picker
-            v-model="formData.startDate"
-            type="date"
-            value-format="x"
-            placeholder="选择加班开始时间"
-          />
-        </el-form-item>
-        <el-form-item label="加班结束时间" prop="endDate">
-          <el-date-picker
-            v-model="formData.endDate"
-            type="date"
-            value-format="x"
-            placeholder="选择加班结束时间"
-          />
-        </el-form-item>
-        <el-form-item label="加班总时长" prop="duration">
-          <el-input v-model="formData.duration" placeholder="请输入加班总时长" />
-        </el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="申请人名字" prop="userName">
+              <div class="pull-left" v-show="true" v-if="userInfo">{{ userInfo}} </div>
+              <div class="pull-left" v-show="true" v-if="!userInfo">获取失败 </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="申请部门名字" prop="deptName">
+              <div class="pull-left" v-show="true" v-if="deptInfo">{{ deptInfo}} </div>
+              <div class="pull-left" v-show="true" v-if="!deptInfo">获取失败 </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="申请标题" prop="title">
+              <el-input v-model="formData.title" placeholder="请输入申请标题" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="申请时间" prop="usageDate">
+              <el-date-picker
+                v-model="formData.usageDate"
+                type="date"
+                value-format="x"
+                placeholder="选择申请时间"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="开始时间" prop="startDate">
+              <el-date-picker
+                v-model="formData.startDate"
+                type="datetime"
+                value-format="x"
+                placeholder="选择加班开始时间"
+                @change="validateDate"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="结束时间" prop="endDate">
+              <el-date-picker
+                v-model="formData.endDate"
+                type="datetime"
+                value-format="x"
+                placeholder="选择加班结束时间"
+                @change="validateDate"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="加班类型" prop="type">
+              <el-select v-model="formData.type" placeholder="请选择加班类型">
+                <el-option
+                  v-for="dict in getIntDictOptions(DICT_TYPE.JBGL_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="加班总时长" prop="duration">
+              <el-input v-model.number="formData.duration" placeholder="请输入加班总时长" disabled/>
+            </el-form-item>
+          </el-col>
+        </el-row>
        <el-form-item label="加班原因" prop="reason">
          <el-input v-model="formData.reason" type="textarea" placeholder="请输入加班原因" />
        </el-form-item>
@ -74,6 +100,7 @@ import * as DefinitionApi from '@/api/bpm/definition'
 import * as UserApi from '@/api/system/user'
 import {useTagsViewStore} from "@/store/modules/tagsView";
 import {getUserProfile} from "@/api/system/user/profile";
+import {number} from "echarts";

 /** 加班管理 表单 */
 defineOptions({ name: 'JbglCreate' })
@ -93,7 +120,7 @@ const formData = ref({
  type: undefined,
  startDate: undefined,
  endDate: undefined,
-  duration: undefined,
+  duration: 0,
  reason: undefined,
  status: undefined,
  processInstanceId: undefined,
@ -111,6 +138,29 @@ const userList = ref<any[]>([]) // 用户列表
 const deptInfo = ref('') // 部门信息
 const userInfo = ref('') // 用户名字

+// 计算属性：计算时间差
+watchEffect(() => {
+  if (formData.value.startDate && formData.value.endDate) {
+    const start = formData.value.startDate
+    const end = formData.value.endDate
+    const differenceInMs = end - start
+    formData.value.duration = differenceInMs > 0 ? Math.floor(differenceInMs / (1000 * 60 * 60)) : -1;
+  }else {
+    formData.value.duration = 0
+  }
+})
+
+// 方法：验证开始时间是否小于结束时间
+const validateDate = () => {
+  if (formData.value.startDate && formData.value.endDate) {
+    const start = formData.value.startDate
+    const end = formData.value.endDate
+    if (start > end) {
+      formData.value.endDate = undefined
+      message.error('开始时间不能大于结束时间')
+    }
+  }
+}
 // 获取用户部门
 const getUserInfo = async () => {
  const user = await getUserProfile();
@ -180,7 +230,7 @@ const formRules = reactive({
  type: [{ required: true, message: '加班类型不能为空', trigger: 'change' }],
  startDate: [{ required: true, message: '加班开始时间不能为空', trigger: 'blur' }],
  endDate: [{ required: true, message: '加班结束时间不能为空', trigger: 'blur' }],
-  duration: [{ required: true, message: '加班总时长不能为空', trigger: 'blur' }],
+  // duration: [{ required: true,type: 'number', message: '加班总时长不能为空且是数字', trigger: 'blur' }],
 })
 const formRef = ref() // 表单 Ref
 </script>
--- a/src/views/Home/jbgl/JbglDetail.vue
+++ b/src/views/Home/jbgl/JbglDetail.vue
@ -9,58 +9,82 @@
        label-width="100px"
        v-loading="formLoading"
      >
-        <el-form-item label="申请标题" prop="title">
-          <el-input v-model="formData.title" placeholder="请输入申请标题" disabled />
-        </el-form-item>
-        <el-form-item label="申请人名字" prop="userName">
-          <div class="pull-left" v-show="true" v-if="userInfo">{{ userInfo}} </div>
-          <div class="pull-left" v-show="true" v-if="!userInfo">获取失败 </div>
-        </el-form-item>
-        <el-form-item label="申请部门名字" prop="deptName">
-          <div class="pull-left" v-show="true" v-if="deptInfo">{{ deptInfo}} </div>
-          <div class="pull-left" v-show="true" v-if="!deptInfo">获取失败 </div>
-        </el-form-item>
-        <el-form-item label="申请时间" prop="usageDate">
-          <el-date-picker
-            v-model="formData.usageDate"
-            type="date"
-            value-format="x"
-            placeholder="选择申请时间"
-            disabled
-          />
-        </el-form-item>
-        <el-form-item label="加班类型" prop="type">
-          <el-select v-model="formData.type" placeholder="请选择加班类型" disabled>
-            <el-option
-              v-for="dict in getIntDictOptions(DICT_TYPE.JBGL_TYPE)"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-              disabled
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="加班开始时间" prop="startDate">
-          <el-date-picker
-            v-model="formData.startDate"
-            type="date"
-            value-format="x"
-            placeholder="选择加班开始时间"
-            disabled
-          />
-        </el-form-item>
-        <el-form-item label="加班结束时间" prop="endDate">
-          <el-date-picker
-            v-model="formData.endDate"
-            type="date"
-            value-format="x"
-            placeholder="选择加班结束时间"
-            disabled
-          />
-        </el-form-item>
-        <el-form-item label="加班总时长" prop="duration">
-          <el-input v-model="formData.duration" placeholder="请输入加班总时长" disabled />
-        </el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="申请人名字" prop="userName">
+              <div class="pull-left" v-show="true" v-if="userInfo">{{ userInfo}} </div>
+              <div class="pull-left" v-show="true" v-if="!userInfo">获取失败 </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="申请部门名字" prop="deptName">
+              <div class="pull-left" v-show="true" v-if="deptInfo">{{ deptInfo}} </div>
+              <div class="pull-left" v-show="true" v-if="!deptInfo">获取失败 </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="申请标题" prop="title">
+              <el-input v-model="formData.title" placeholder="请输入申请标题" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="申请时间" prop="usageDate">
+              <el-date-picker
+                v-model="formData.usageDate"
+                type="date"
+                value-format="x"
+                placeholder="选择申请时间"
+                disabled
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="开始时间" prop="startDate">
+              <el-date-picker
+                v-model="formData.startDate"
+                type="datetime"
+                value-format="x"
+                placeholder="选择加班开始时间"
+                disabled
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="结束时间" prop="endDate">
+              <el-date-picker
+                v-model="formData.endDate"
+                type="datetime"
+                value-format="x"
+                placeholder="选择加班结束时间"
+                disabled
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="加班类型" prop="type">
+              <el-select v-model="formData.type" placeholder="请选择加班类型" disabled>
+                <el-option
+                  v-for="dict in getIntDictOptions(DICT_TYPE.JBGL_TYPE)"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                  disabled
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="加班总时长" prop="duration">
+              <el-input v-model="formData.duration" placeholder="请输入加班总时长" disabled />
+            </el-form-item>
+          </el-col>
+        </el-row>
        <el-form-item label="加班原因" prop="reason">
          <el-input v-model="formData.reason" type="textarea" placeholder="请输入加班原因" disabled />
        </el-form-item>
Author	SHA1	Message	Date
XaoLi717	ada57beec5	加班管理	2024-11-07 18:59:48 +08:00
XaoLi717	d8f08072c5	加班管理	2024-11-07 18:58:43 +08:00
XaoLi717	f42adb7645	加班管理	2024-11-07 16:25:41 +08:00
XaoLi717	8182ec7d97	加班管理	2024-11-07 15:52:39 +08:00