完成 bpm oa 请假的 create 和 detail 前端

yudao-admin-ui/src/api/oa/leave.js

@@ -3,7 +3,7 @@ import request from '@/utils/request'
 // 创建请假申请
 export function createLeave(data) {
   return request({
-    url: '/oa/leave/create',
+    url: '/bpm/oa/leave/create',
     method: 'post',
     data: data
   })
@@ -20,7 +20,7 @@ export function deleteLeave(id) {
 // 获得请假申请
 export function getLeave(id) {
   return request({
-    url: '/oa/leave/get?id=' + id,
+    url: '/bpm/oa/leave/get?id=' + id,
     method: 'get'
   })
 }
@@ -33,18 +33,3 @@ export function getLeavePage(query) {
     params: query
   })
 }
-
-export function createFormKeyLeave(data) {
-  return request({
-    url: '/oa/leave/form-key/create',
-    method: 'post',
-    data: data
-  })
-}
-
-export function getLeaveApplyMembers() {
-  return request({
-    url: '/oa/leave/getLeaveApplyMembers',
-    method: 'get'
-  })
-}

yudao-admin-ui/src/router/index.js

@@ -123,16 +123,21 @@ export const constantRoutes = [
     ]
   },
   {
-    path: '/flow',
+    path: '/bpm',
     component: Layout,
     hidden: true,
     redirect: 'noredirect',
     children: [
       {
-        path: 'leave/apply',
+        path: 'oa/leave/create',
         component: (resolve) => require(['@/views/bpm/oa/leave/create'], resolve),
-        name: '请假表单-申请',
-        meta: { title: '请假表单-申请', icon: 'form' }
+        name: '发起 OA 请假',
+        meta: { title: '发起 OA 请假', icon: 'form' }
+      }, {
+        path: 'oa/leave/detail',
+        component: (resolve) => require(['@/views/bpm/oa/leave/detail'], resolve),
+        name: '查看 OA 请假',
+        meta: { title: '查看 OA 请假', icon: 'view' }
       }
     ]
   },

yudao-admin-ui/src/views/bpm/oa/leave/create.vue

@@ -8,38 +8,26 @@
         <el-form-item label="结束时间" prop="endTime">
           <el-date-picker clearable size="small" v-model="form.endTime" type="date" value-format="timestamp" placeholder="选择结束时间" />
         </el-form-item>
-        <el-form-item label="请假类型" prop="leaveType">
-          <el-select v-model="form.leaveType" placeholder="请选择">
-            <el-option
-              v-for="dict in leaveTypeDictData"
-              :key="parseInt(dict.value)"
-              :label="dict.label"
-              :value="parseInt(dict.value)"
-            />
+        <el-form-item label="请假类型" prop="type">
+          <el-select v-model="form.type" placeholder="请选择">
+            <el-option v-for="dict in typeDictData" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/>
           </el-select>
         </el-form-item>
         <el-form-item label="原因" prop="reason">
           <el-col :span="10">
-            <el-input
-              type="textarea"
-              :rows="3"
-              v-model="form.reason"
-              placeholder="请输入原因" />
+            <el-input type="textarea" :rows="3" v-model="form.reason" placeholder="请输入原因" />
           </el-col>
         </el-form-item>
-        <el-form-item label="申请时间" prop="applyTime">
-          <el-date-picker clearable size="small" v-model="form.applyTime" type="date" value-format="timestamp" placeholder="选择申请时间" />
-        </el-form-item>
         <el-form-item>
-          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button type="primary" @click="submitForm">提 交</el-button>
         </el-form-item>
       </el-form>
   </div>
 </template>
 
 <script>
-import { createFormKeyLeave} from "@/api/oa/leave"
-import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
+import { createLeave} from "@/api/oa/leave"
+import { getDictDatas, DICT_TYPE } from '@/utils/dict'
 export default {
   name: "LeaveCreate",
   components: {
@@ -48,31 +36,23 @@ export default {
     return {
       // 表单参数
       form: {
-        processKey: 'leave-update',
-        taskVariables:{
-          hr: "",
-          pm: "",
-          bm: ""
-        }
+        startTime: undefined,
+        endTime: undefined,
+        type: undefined,
+        reason: undefined,
       },
       // 表单校验
       rules: {
         startTime: [{ required: true, message: "开始时间不能为空", trigger: "blur" }],
         endTime: [{ required: true, message: "结束时间不能为空", trigger: "blur" }],
-        applyTime: [{ required: true, message: "申请时间不能为空", trigger: "blur" }],
+        type: [{ required: true, message: "请假类型不能为空", trigger: "change" }],
+        reason: [{ required: true, message: "请假原因不能为空", trigger: "change" }],
       },
 
-      statusFormat(row, column) {
-        return getDictDataLabel(DICT_TYPE.OA_LEAVE_STATUS, row.status)
-      },
-      leaveTypeDictData: getDictDatas(DICT_TYPE.BPM_OA_LEAVE_TYPE),
-      leaveStatusData: getDictDatas(DICT_TYPE.OA_LEAVE_STATUS)
+      typeDictData: getDictDatas(DICT_TYPE.BPM_OA_LEAVE_TYPE),
     };
   },
   created() {
-    this.form.taskVariables.hr = this.$route.query.hr;
-    this.form.taskVariables.pm = this.$route.query.pm;
-    this.form.taskVariables.bm = this.$route.query.bm;
   },
   methods: {
     /** 提交按钮 */
@@ -83,13 +63,10 @@ export default {
         }
 
         // 添加的提交
-        createFormKeyLeave(this.form).then(response => {
-          this.msgSuccess("新增成功");
-          this.$store.dispatch('tagsView/delView', this.$route).then(({ visitedViews }) => {
-            //if (this.isActive(this.$route)) {
-            this.$router.push({path: '/oa/todo'})
-            //}
-          })
+        createLeave(this.form).then(response => {
+          this.msgSuccess("发起成功");
+          this.$store.dispatch("tagsView/delView", this.$route);
+          this.$router.push({ path: "/bpm/oa/leave"});
         });
       });
     }

yudao-admin-ui/src/views/bpm/oa/leave/detail.vue

@@ -0,0 +1,54 @@
+<template>
+  <div class="app-container">
+    <!-- 对话框(添加 / 修改) -->
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+        <el-form-item label="开始时间：" prop="startTime"> {{parseTime(form.startTime, '{y}-{m}-{d}')}} </el-form-item>
+        <el-form-item label="结束时间：" prop="endTime"> {{parseTime(form.endTime, '{y}-{m}-{d}')}} </el-form-item>
+        <el-form-item label="请假类型：" prop="type">{{ typeFormat(form) }}</el-form-item>
+        <el-form-item label="原因：" prop="reason"> {{ form.reason }}</el-form-item>
+      </el-form>
+  </div>
+</template>
+
+<script>
+import { getLeave} from "@/api/oa/leave"
+import {getDictDatas, DICT_TYPE, getDictDataLabel} from '@/utils/dict'
+export default {
+  name: "LeaveDetail",
+  components: {
+  },
+  data() {
+    return {
+      id: undefined, // 请假编号
+      // 表单参数
+      form: {
+        startTime: undefined,
+        endTime: undefined,
+        type: undefined,
+        reason: undefined,
+      },
+
+      typeDictData: getDictDatas(DICT_TYPE.BPM_OA_LEAVE_TYPE),
+    };
+  },
+  created() {
+    this.id = this.$route.query.id;
+    if (!this.id) {
+      this.$message.error('未传递 id 参数，无法查看 OA 请假信息');
+      return;
+    }
+    this.getDetail();
+  },
+  methods: {
+    /** 获得请假信息 */
+    getDetail() {
+      getLeave(this.id).then(response => {
+        this.form = response.data;
+      });
+    },
+    typeFormat(row) {
+      return getDictDataLabel(DICT_TYPE.BPM_OA_LEAVE_TYPE, row.type)
+    }
+  }
+};
+</script>

yudao-admin-ui/src/views/bpm/oa/leave/index.vue

@@ -30,7 +30,7 @@
     <!-- 操作工具栏 -->
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
+        <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">发起请假</el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
@@ -58,7 +58,7 @@
       </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleDetail(scope.row)">详情</el-button>
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.row)">详情</el-button>
           <el-button size="mini" type="text" icon="el-icon-edit" @click="handleProcessDetail(scope.row)">审批进度</el-button>
         </template>
       </el-table-column>
@@ -67,58 +67,6 @@
     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
                 @pagination="getList"/>
 
-    <!-- 对话框(添加 / 修改) -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="开始时间" prop="startTime">
-          <el-date-picker clearable size="small" v-model="form.startTime" type="date" value-format="timestamp" placeholder="选择开始时间" />
-        </el-form-item>
-        <el-form-item label="结束时间" prop="endTime">
-          <el-date-picker clearable size="small" v-model="form.endTime" type="date" value-format="timestamp" placeholder="选择结束时间" />
-        </el-form-item>
-        <el-form-item label="请假类型" prop="leaveType">
-          <el-select v-model="form.leaveType" placeholder="请选择">
-            <el-option
-              v-for="dict in leaveTypeDictData"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="原因" prop="reason">
-          <el-input v-model="form.reason" placeholder="请输入原因" />
-        </el-form-item>
-        <el-form-item label="申请时间" prop="applyTime">
-          <el-date-picker clearable size="small" v-model="form.applyTime" type="date" value-format="timestamp" placeholder="选择申请时间" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-
-    <el-dialog :title="title" :visible.sync="dialogDetailVisible" width="500px" append-to-body>
-      <el-form ref="form" :model="form"  label-width="80px">
-      <el-form-item label="状态" >
-        {{ getDictDataLabel(DICT_TYPE.OA_LEAVE_STATUS, form.status) }}
-      </el-form-item>
-      <el-form-item label="申请人id" >{{form.userId}}</el-form-item>
-      <el-form-item label="开始时间" >{{ parseTime(form.startTime) }}</el-form-item>
-      <el-form-item label="结束时间" prop="endTime">{{ parseTime(form.endTime) }}</el-form-item>
-      <el-form-item label="请假类型" prop="leaveType">
-        {{ getDictDataLabel(DICT_TYPE.BPM_OA_LEAVE_TYPE, form.leaveType) }}
-      </el-form-item>
-      <el-form-item label="原因" prop="reason">{{form.reason}}</el-form-item>
-      <el-form-item label="申请时间" prop="applyTime">{{ parseTime(form.applyTime) }}</el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="dialogDetailVisible = false">确 定</el-button>
-        <el-button @click="dialogDetailVisible = false">取 消</el-button>
-      </div>
-    </el-dialog>
-
   </div>
 </template>
 
@@ -156,17 +104,9 @@ export default {
         leaveType: null,
         reason: null,
       },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        startTime: [{ required: true, message: "开始时间不能为空", trigger: "blur" }],
-        endTime: [{ required: true, message: "结束时间不能为空", trigger: "blur" }],
-      },
+
       leaveTypeDictData: getDictDatas(DICT_TYPE.BPM_OA_LEAVE_TYPE),
       leaveResultData: getDictDatas(DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT),
-
-      dialogDetailVisible: false, // TODO 芋艿：后面挪到详情页
     };
   },
   created() {
@@ -186,25 +126,6 @@ export default {
         this.loading = false;
       });
     },
-    /** 取消按钮 */
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    /** 表单重置 */
-    reset() {
-      this.form = {
-        id: undefined,
-        status: undefined,
-        userId: undefined,
-        startTime: undefined,
-        endTime: undefined,
-        leaveType: undefined,
-        reason: undefined,
-        applyTime: undefined,
-      };
-      this.resetForm("form");
-    },
     /** 搜索按钮操作 */
     handleQuery() {
       this.queryParams.pageNo = 1;
@@ -212,54 +133,22 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.dateRangeStartTime = [];
-      this.dateRangeEndTime = [];
       this.dateRangeCreateTime = [];
       this.resetForm("queryForm");
       this.handleQuery();
     },
     /** 新增按钮操作 */
     handleAdd() {
-      getLeaveApplyMembers().then(response => {
-        const route = {
-          path: '/flow/leave/apply',
-          query: {
-            hr:  response.data.hr,
-            pm:  response.data.pm,
-            bm : response.data.bm
-          }
-        }
-        this.$router.replace(route);
-      });
+      this.$router.push({ path: "/bpm/oa/leave/create"});
     },
     /** 详情按钮操作 */
     handleDetail(row) {
-      this.reset();
-      const id = row.id;
-      getLeave(id).then(response => {
-        this.form = response.data;
-        this.dialogDetailVisible = true
-        this.title = "请假详情";
-      });
+      this.$router.push({ path: "/bpm/oa/leave/detail", query: { id: row.id}});
     },
     /** 查看审批进度的操作 */
     handleProcessDetail(row) {
       this.$router.push({ path: "/bpm/process-instance/detail", query: { id: row.processInstanceId}});
     },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (!valid) {
-          return;
-        }
-        // 添加的提交
-        createLeave(this.form).then(response => {
-          this.msgSuccess("新增成功");
-          this.open = false;
-          this.getList();
-        });
-      });
-    },
     resultFormat(row, column) {
       return getDictDataLabel(DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT, row.result)
     },