Procházet zdrojové kódy

工时管家——日报填写

ZhouRuiTing před 5 roky
rodič
revize
c48d13aec7

+ 2 - 0
fhKeeper/formulahousekeeper/timesheet/src/port.js

@@ -47,5 +47,7 @@ export default {
     report: {
         list: '/report/getReportList',                          // 获取报告列表
         export: '/report/exportReport',                         // 导出报告
+        getPort: '/report/getReport',                           // 获取当天自己报告
+        editPort: '/report/editReport',                             // 编辑报告
     }
 }

+ 399 - 420
fhKeeper/formulahousekeeper/timesheet/src/views/workReport/daily.vue

@@ -1,459 +1,438 @@
 <template>
-  <section>
-    <!--工具条-->
-    <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
-      <el-form :inline="true">
-        <el-form-item>
-          <el-date-picker
-            v-model="date"
-            :editable="false"
-            format="yyyy-MM"
-            value-format="yyyy-MM"
-            @change="changeMonth()"
-            :clearable="false"
-            type="month"
-            placeholder="选择月份"
-          ></el-date-picker>
-        </el-form-item>
-        <el-form-item style="float:right;">
-          <el-link type="primary" :underline="false" @click="exportReport">导出日报</el-link>
-        </el-form-item>
-        <!-- <el-form-item style="float:right;">
-          <el-link type="primary" :underline="false" @click="projectDialogVisible=true">项目管理</el-link>
-        </el-form-item> -->
-      </el-form>
-    </el-col>
+    <section>
+        <!--工具条-->
+        <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
+            <el-form :inline="true">
+                <el-form-item>
+                    <el-date-picker v-model="date" :editable="false" format="yyyy-MM" value-format="yyyy-MM" 
+                    @change="changeMonth()" :clearable="false" type="month" placeholder="选择月份"></el-date-picker>
+                </el-form-item>
+                <el-form-item style="float:right;">
+                    <el-link type="primary" :underline="false" v-if="user.role != 0" @click="exportReport">导出日报</el-link>
+                </el-form-item>
+                <el-form-item style="float:right;">
+                    <el-link type="primary" :underline="false" @click="fillInReport">填写日报</el-link>
+                </el-form-item>
+            </el-form>
+        </el-col>
 
-    <!--列表-->
-    <div>
-      <el-card class="box-card daily" shadow="never" :style="'height:'+tableHeight +'px'">
-        <div slot="header" class="clearfix">
-          <span>日期:</span>
-          <span
-            v-for="(item,index) in allDate"
-            :id="'day'+index"
-            :class="index==choseDay?'chooseDate date_item':'date_item'"
-            @click="choseDate(index)"
-            :key="index"
-          >{{item}}</span>
+        <!--列表-->
+        <div>
+            <el-card class="box-card daily" shadow="never" :style="'height:'+tableHeight +'px'">
+                <div slot="header" class="clearfix">
+                    <span>日期:</span>
+                    <span v-for="(item,index) in allDate" :id="'day'+index" :class="index==choseDay?'chooseDate date_item':'date_item'" 
+                    @click="choseDate(index)" :key="index">{{item}}</span>
+                </div>
+                <div class="allDaily">
+                    <div class="one_daily" v-for="(item1,index1) in reportList" :key="index1">
+                        <el-link><i class="fa fa-circle"></i>{{item1.name}}</el-link>
+                        <div class="one_daily_body">
+                            <el-timeline>
+                                <el-timeline-item v-for="(item2,index2) in item1.data" :key="index2">
+                                    <el-card shadow="never">
+                                        <p>项目:<b>{{item2.project}}</b></p>
+                                        <p>时长:{{item2.time}}h</p>
+                                        <p>事项:<span v-html="item2.content"></span></p>
+                                    </el-card>
+                                </el-timeline-item>
+                            </el-timeline>
+                        </div>
+                    </div>
+                    <!-- 简陋的无报告提示 -->
+                    <span v-if="reportList.length==0">本日暂无报告</span>
+                </div>
+            </el-card>
         </div>
-        <div class="allDaily">
-          <div class="one_daily" v-for="(item1,index1) in reportList" :key="index1">
-            <el-link>
-              <i class="fa fa-circle"></i>
-              {{item1.name}}
-            </el-link>
-            <div class="one_daily_body">
-              <el-timeline>
-                <el-timeline-item v-for="(item2,index2) in item1.data" :key="index2">
-                  <el-card shadow="never">
-                    <p>
-                      项目:
-                      <b>{{item2.project}}</b>
-                    </p>
-                    <p>时长:{{item2.time}}h</p>
-                    <p>
-                      事项:
-                      <span v-html="item2.content"></span>
-                    </p>
-                  </el-card>
-                </el-timeline-item>
-              </el-timeline>
-            </div>
-          </div>
-          <!-- 简陋的无报告提示 -->
-          <span v-if="reportList.length==0">本日暂无报告</span>
-        </div>
-      </el-card>
-    </div>
 
-    <!-- 项目管理的dialog -->
-    <el-dialog title="项目管理" :visible.sync="projectDialogVisible" width="50%">
-      <!-- 现在原生的CSS 有按钮跳动和下边距的问题 -->
-      <div>
-        <el-tag
-          :key="index"
-          v-for="(item,index) in projectList"
-          closable
-          :disable-transitions="false"
-          @close="handleClose(item)"
-        >{{item.projectName}}</el-tag>
-        <el-input
-          class="input-new-tag"
-          v-if="inputVisible"
-          v-model="inputValue"
-          ref="saveTagInput"
-          size="small"
-          @keyup.enter.native="handleInputConfirm"
-          @blur="handleInputConfirm"
-        ></el-input>
-        <el-button v-else class="button-new-tag" size="small" @click="showInput">新增项目</el-button>
-      </div>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="projectDialogVisible = false">关闭</el-button>
-      </span>
-    </el-dialog>
-  </section>
+        <!-- 项目管理的dialog -->
+        <el-dialog title="填写日报" :visible.sync="dialogVisible" width="60%">
+            <el-form ref="workForm" :model="workForm" :rules="workRules" label-width="100px">
+                <el-form-item label="工作日期" prop="createDate">
+                    <el-date-picker v-model="workForm.createDate" :editable="false" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
+                    @change="changeMonth()" :clearable="false" type="date" placeholder="选择工作日期" style="width:100%;"></el-date-picker>
+                </el-form-item>
+                <el-form-item label="待分配时长" prop="name">
+                    <span>{{report.time}}h</span>
+                    <el-link type="primary" :underline="false" @click="addDomain" style="margin-left:40px">添加项目</el-link>
+                </el-form-item>
+                <div v-for="(domain, index) in workForm.domains" :key="domain.id">
+                    <el-form-item label="投入项目" :prop="'domains.' + index + '.projectId'"
+                        :rules="{ required: true, message: '请选择投入项目', trigger: ['change','blur'] }">
+                        <el-select v-model="domain.projectId" placeholder="请选择" style="width:200px;">
+                            <el-option v-for="item in projectList" :key="item.id" :label="item.projectName" :value="item.id"></el-option>
+                        </el-select>
+                        <el-link v-if="index >= 1" type="primary" :underline="false" @click="delDomain(index)" style="float:right;margin-right:10px;">
+                            <i class="fa fa-trash" style="color: red;;font-size:18px;"></i>
+                        </el-link>
+                    </el-form-item>
+
+                    <el-form-item label="投入时长" :prop="'domains.' + index + '.workingTime'"
+                        :rules="{ required: true, message: '请输入投入时长', trigger: 'blur' }">
+                        <el-input v-model.number="domain.workingTime" placeholder="请输入投入时长" type='number' clearable style="width:200px;"></el-input>
+                    </el-form-item>
+
+                    <el-form-item label="工作事项" :prop="'domains.' + index + '.content'" :rules="{ required: true, message: '请输入工作事项', trigger: 'blur' }">
+                        <el-input v-model="domain.content" type="textarea" :rows="4" placeholder="请输入投入时长" clearable></el-input>
+                    </el-form-item>
+                    <el-divider v-if="workForm.domains.length>1"></el-divider>
+                </div>
+            </el-form>
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="dialogVisible = false">取消</el-button>
+                <el-button type="primary" @click="submitDepartment">提交</el-button>
+            </span>
+        </el-dialog>
+    </section>
 </template>
 
 <script>
-import util from "../../common/js/util";
+    import util from "../../common/js/util";
 
-export default {
-  data() {
-    return {
-      user: JSON.parse(sessionStorage.getItem("user")),
+    export default {
+        data() {
+            return {
+                user: JSON.parse(sessionStorage.getItem("user")),
 
-      allDate: [],
-      date: util.formatDate.format(new Date(new Date()), "yyyy-MM"),
-      choseDay: 0,
+                allDate: [],
+                date: util.formatDate.format(new Date(new Date()), "yyyy-MM"),
+                choseDay: 0,
 
-      tableHeight: 0,
-      listLoading: false,
+                tableHeight: 0,
+                listLoading: false,
 
-      projectList: [], //项目列表
-      reportList: [], //日报列表
-      projectDialogVisible: false, //项目弹窗
-      inputVisible: false, //项目新增输入
-      inputValue: "" //项目新增值
-    };
-  },
-  methods: {
-    changeMonth() {
-      this.getAllDate();
-      this.getReportList();
-    },
+                projectList: [], //项目列表
+                reportList: [], //日报列表
 
-    choseDate(i) {
-      this.choseDay = i;
-      this.getReportList();
-    },
+                dialogVisible: false, //项目弹窗
+                report: '',
+                workForm: {
+                    createDate: util.formatDate.format(new Date(new Date()), "yyyy-MM-dd"),
+                    domains: [{
+                        id: null,
+                        projectId: "",
+                        workingTime: "",
+                        content: ""
+                    }],
+                },
+                workRules: {
+                    createDate: [{ required: true, message: "请选择工作日期", trigger: "change" }],
+                }
+            };
+        },
+        methods: {
+            // 改变月份
+            changeMonth() {
+                this.getAllDate();
+                this.getReportList();
+            },
 
-    getAllDate() {
-      var dayArry = [];
-      var day = this.getCountDays();
-      for (var k = 1; k <= day; k++) {
-        var str =
-          new Date(this.date.replace(/-/g, "/")).getMonth() +
-          1 +
-          "月" +
-          k +
-          "日";
-        if (
-          new Date(this.date.replace(/-/g, "/")).getFullYear() ==
-            new Date(new Date()).getFullYear() &&
-          new Date(this.date.replace(/-/g, "/")).getMonth() ==
-            new Date(new Date()).getMonth()
-        ) {
-          if (new Date().getDate() == k) {
-            this.choseDay = k - 1;
-          }
-        } else {
-          this.choseDay = 0;
-        }
-        dayArry.push(str);
-      }
-      this.allDate = dayArry;
-    },
+            // 选择日期
+            choseDate(i) {
+                this.choseDay = i;
+                this.getReportList();
+            },
 
-    getCountDays() {
-      var newstr = this.date.replace(/-/g, "/");
-      var curDate = new Date(newstr);
-      var curMonth = curDate.getMonth();
-      curDate.setMonth(curMonth + 1);
-      curDate.setDate(0);
-      return curDate.getDate();
-    },
+            // 获取日期列表
+            getAllDate() {
+                var dayArry = [];
+                var day = this.getCountDays();
+                for (var k = 1; k <= day; k++) {
+                    var str = new Date(this.date.replace(/-/g, "/")).getMonth() + 1 + "月" + k + "日";
+                    if ( new Date(this.date.replace(/-/g, "/")).getFullYear() == new Date(new Date()).getFullYear() &&
+                    new Date(this.date.replace(/-/g, "/")).getMonth() == new Date(new Date()).getMonth()) {
+                        if (new Date().getDate() == k) {
+                            this.choseDay = k - 1;
+                        }
+                    } else {
+                        this.choseDay = 0;
+                    }
+                    dayArry.push(str);
+                }
+                this.allDate = dayArry;
+            },
 
-    //获取项目列表
-    getProjectList() {
-      this.listLoading = true;
-      this.http.post(
-        this.port.project.list,
-        {},
-        res => {
-          this.listLoading = false;
-          if (res.code == "ok") {
-            this.projectList = res.data;
-          } else {
-            this.$message({
-              message: res.msg,
-              type: "error"
-            });
-          }
-        },
-        error => {
-          this.listLoading = false;
-          this.$message({
-            message: error,
-            type: "error"
-          });
-        }
-      );
-    },
+            getCountDays() {
+                var newstr = this.date.replace(/-/g, "/");
+                var curDate = new Date(newstr);
+                var curMonth = curDate.getMonth();
+                curDate.setMonth(curMonth + 1);
+                curDate.setDate(0);
+                return curDate.getDate();
+            },
 
-    //删除项目
-    handleClose(item) {
-      this.$confirm("确定要删除项目" + item.projectName + "吗?", "删除项目", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      })
-        .then(() => {
-          this.listLoading = true;
-          this.http.post(
-            this.port.project.delete,
-            { id: item.id },
-            res => {
-              this.listLoading = false;
-              if (res.code == "ok") {
-                this.$message({
-                  type: "success",
-                  message: "项目删除成功"
-                });
-                this.getProjectList();
-              } else {
-                this.$message({
-                  message: res.msg,
-                  type: "error"
+            //获取日报列表
+            getReportList() {
+                this.listLoading = true;
+                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
+                this.http.post( this.port.report.list, { date: this.date + day },
+                res => {
+                    this.listLoading = false;
+                    if (res.code == "ok") {
+                        this.reportList = res.data;
+                    } else {
+                        this.$message({
+                            message: res.msg,
+                            type: "error"
+                        });
+                    }
+                },
+                error => {
+                    this.listLoading = false;
+                    this.$message({
+                        message: error,
+                        type: "error"
+                    });
                 });
-              }
             },
-            error => {
-              this.listLoading = false;
-              this.$message({
-                message: error,
-                type: "error"
-              });
-            }
-          );
-        })
-        .catch(() => {});
-    },
-
-    //显示输入
-    showInput() {
-      this.inputVisible = true;
-      this.$nextTick(_ => {
-        this.$refs.saveTagInput.$refs.input.focus();
-      });
-    },
 
-    //处理输入信息
-    handleInputConfirm() {
-      let inputValue = this.inputValue;
-      if (inputValue) {
-        this.$confirm("确定要新增项目" + inputValue + "吗?", "新增项目", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            this.listLoading = true;
-            this.http.post(
-              this.port.project.add,
-              { name: inputValue },
-              res => {
-                this.listLoading = false;
-                if (res.code == "ok") {
-                  this.$message({
-                    type: "success",
-                    message: "新增项目成功"
-                  });
-                  this.getProjectList();
+            //导出日报
+            exportReport() {
+                if (this.reportList.length > 0) {
+                    this.listLoading = true;
+                    //首先处理日期
+                    let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
+                    this.http.post( this.port.report.export, { date: this.date + day },
+                    res => {
+                        this.listLoading = false;
+                        if (res.code == "ok") {
+                            location.href = res.data;
+                        } else {
+                            this.$message({
+                                message: res.msg,
+                                type: "error"
+                            });
+                        }
+                    },
+                    error => {
+                        this.listLoading = false;
+                        this.$message({
+                            message: error,
+                            type: "error"
+                        });
+                    });
                 } else {
-                  this.$message({
-                    message: res.msg,
-                    type: "error"
-                  });
+                    this.$message({
+                        message: "当天没有报告 无法导出",
+                        type: "info"
+                    });
                 }
-              },
-              error => {
-                this.listLoading = false;
-                this.$message({
-                  message: error,
-                  type: "error"
+            },
+
+            //获取项目列表
+            getProjectList() {
+                this.listLoading = true;
+                this.http.post( this.port.project.list, {},
+                res => {
+                    this.listLoading = false;
+                    if (res.code == "ok") {
+                        this.projectList = res.data;
+                    } else {
+                        this.$message({
+                            message: res.msg,
+                            type: "error"
+                        });
+                    }
+                },
+                error => {
+                    this.listLoading = false;
+                    this.$message({
+                        message: error,
+                        type: "error"
+                    });
                 });
-              }
-            );
-          })
-          .catch(() => {});
-      }
-      this.inputVisible = false;
-      this.inputValue = "";
-    },
+            },
 
-    //获取日报列表
-    getReportList() {
-      this.listLoading = true;
-      //首先处理日期
-      let day =
-        this.choseDay > 9
-          ? "-" + (this.choseDay + 1)
-          : "-0" + (this.choseDay + 1);
-      this.http.post(
-        this.port.report.list,
-        {
-          date: this.date + day
-        },
-        res => {
-          this.listLoading = false;
-          if (res.code == "ok") {
-            this.reportList = res.data;
-          } else {
-            this.$message({
-              message: res.msg,
-              type: "error"
-            });
-          }
-        },
-        error => {
-          this.listLoading = false;
-          this.$message({
-            message: error,
-            type: "error"
-          });
-        }
-      );
-    },
+            // 获取个人某天的日报
+            getReport() {
+                this.http.post( this.port.report.getPort, {
+                    date: this.workForm.createDate
+                },
+                res => {
+                    if (res.code == "ok") {
+                        var list = res.data;
+                        this.report = list;
+                        if(list.report.length != 0) {
+                            var arr = [];
+                            for(var i in list.report) {
+                                arr.push({
+                                    id: list.report[i].id,
+                                    projectId: list.report[i].projectId,
+                                    workingTime: list.report[i].workingTime,
+                                    content: list.report[i].content
+                                })
+                            }
+                            this.workForm = {
+                                createDate: this.workForm.createDate,
+                                domains: arr,
+                            }
+                        } else {
+                            this.workForm = {
+                                createDate: this.workForm.createDate,
+                                domains: [{
+                                    id: null,
+                                    projectId: "",
+                                    workingTime: "",
+                                    content: ""
+                                }],
+                            }
+                        }
+                    } else {
+                        this.$message({
+                            message: res.msg,
+                            type: "error"
+                        });
+                    }
+                },
+                error => {
+                    this.$message({
+                        message: error,
+                        type: "error"
+                    });
+                });
+            },
 
-    //导出日报
-    exportReport() {
-      if (this.reportList.length > 0) {
-        this.listLoading = true;
-        //首先处理日期
-        let day =
-          this.choseDay > 9
-            ? "-" + (this.choseDay + 1)
-            : "-0" + (this.choseDay + 1);
-        this.http.post(
-          this.port.report.export,
-          {
-            date: this.date + day
-          },
-          res => {
-            this.listLoading = false;
-            if (res.code == "ok") {
-              location.href = res.data;
-            } else {
-              this.$message({
-                message: res.msg,
-                type: "error"
-              });
-            }
-          },
-          error => {
-            this.listLoading = false;
-            this.$message({
-              message: error,
-              type: "error"
-            });
-          }
-        );
-      } else {
-        this.$message({
-          message: "当天没有报告 无法导出",
-          type: "info"
-        });
-      }
-    },
+            // 打开日报填写
+            fillInReport() {
+                this.getReport();
+                this.dialogVisible = true;
+            },
+
+            // 添加模块
+            addDomain() {
+                this.workForm.domains.push({
+                        projectId: "",
+                        workingTime: "",
+                        content: ""
+                });
+            },
 
-    // 获取异常列表
-    getUnusual() {
-      this.listLoading = true;
-      this.http.post(
-        this.port.project.projectList,
-        {},
-        res => {
-          this.listLoading = false;
-          if (res.code == "ok") {
-          } else {
-            this.$message({
-              message: res.msg,
-              type: "error"
-            });
-          }
+            // 移除模块
+            delDomain(i) {
+                this.workForm.domains.splice(i,1)
+            },
+
+            // 改变月份
+            changeMonth() {
+                this.getReport()
+            },
+
+            // 保存日报
+            submitDepartment() {
+                this.$refs.workForm.validate(valid => {
+                    if (valid) {
+                        this.listLoading = true;
+                        let formData = new FormData();
+                        for(var i in this.workForm.domains) {
+                            if (this.workForm.domains[i].id != null) {
+                                formData.append("id", this.workForm.domains[i].id);
+                            } else {
+                                formData.append("id", -1);
+                            }
+                            formData.append("projectId", this.workForm.domains[i].projectId);
+                            formData.append("workingTime", this.workForm.domains[i].workingTime);
+                            formData.append("content", this.workForm.domains[i].content);
+                            formData.append("createDate", this.workForm.createDate);
+                        }
+                        this.http.uploadFile( this.port.report.editPort, formData,
+                        res => {
+                            this.listLoading = false;
+                            if (res.code == "ok") {
+                                this.$message({
+                                    message: "填报成功",
+                                    type: "success"
+                                });
+                                this.dialogVisible = false;
+                                this.getReportList();
+                            } else {
+                                this.$message({
+                                    message: res.msg,
+                                    type: "error"
+                                });
+                            }
+                        },
+                        error => {
+                            this.listLoading = false;
+                            this.$message({
+                                message: error,
+                                type: "error"
+                            });
+                        });
+                    }
+                });
+            },
+
+        },
+        created() {
+            let height = window.innerHeight;
+            this.tableHeight = height - 170;
+            const that = this;
+            window.onresize = function temp() {
+                that.tableHeight = window.innerHeight - 170;
+            };
         },
-        error => {
-          this.listLoading = false;
-          this.$message({
-            message: error,
-            type: "error"
-          });
+        mounted() {
+            this.getAllDate();
+            this.getReportList();
+            this.getProjectList();
         }
-      );
-    }
-  },
-  created() {
-    let height = window.innerHeight;
-    this.tableHeight = height - 170;
-    const that = this;
-    window.onresize = function temp() {
-      that.tableHeight = window.innerHeight - 170;
     };
-  },
-  mounted() {
-    this.getAllDate();
-    this.getReportList();
-    this.getProjectList();
-  }
-};
 </script>
 
 <style lang="scss" scoped>
-.clearfix {
-  overflow-x: auto;
-  white-space: nowrap;
-  padding: 15px 0;
-  .date_item {
-    padding: 0 15px;
-    cursor: pointer;
-  }
-  .chooseDate {
-    color: #20a0ff;
-  }
-}
+    .clearfix {
+        overflow-x: auto;
+        white-space: nowrap;
+        padding: 15px 0;
+        .date_item {
+            padding: 0 15px;
+            cursor: pointer;
+        }
+        .chooseDate {
+            color: #20a0ff;
+        }
+    }
 
-.one_daily {
-  i {
-    color: #9ed0ff;
-    margin-right: 5px;
-  }
-  .one_daily_body {
-    padding: 15px 0px;
-    p {
-      margin: 0;
-      line-height: 30px;
+    .one_daily {
+        i {
+            color: #9ed0ff;
+            margin-right: 5px;
+        }
+        .one_daily_body {
+            padding: 15px 0px;
+            p {
+            margin: 0;
+            line-height: 30px;
+            }
+        }
+        ul {
+            padding: 0;
+        }
     }
-  }
-  ul {
-    padding: 0;
-  }
-}
 </style>
 <style lang="scss">
-.daily {
-  .el-card__body {
-    height: 82%;
-    overflow-y: auto;
-  }
-}
+    .daily {
+        .el-card__body {
+            height: 82%;
+            overflow-y: auto;
+        }
+    }
 </style>
 <style scoped>
 /* 项目标签的样式 */
-.el-tag + .el-tag {
-  margin-left: 10px;
-}
-.button-new-tag {
-  margin-left: 10px;
-  height: 32px;
-  line-height: 30px;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.input-new-tag {
-  width: 90px;
-  margin-left: 10px;
-  vertical-align: bottom;
-}
+    .el-tag + .el-tag {
+        margin-left: 10px;
+    }
+    .button-new-tag {
+        margin-left: 10px;
+        height: 32px;
+        line-height: 30px;
+        padding-top: 0;
+        padding-bottom: 0;
+    }
+    .input-new-tag {
+        width: 90px;
+        margin-left: 10px;
+        vertical-align: bottom;
+    }
 </style>