新增工作统计页面

src/components/work/workManager2.vue

+<template>
+  <div class="flexOne groupts">
+    <div class="enrollTotalSearch">
+      <ul>
+        <li>
+          <span>
+            <em>{{$t('system.table_company')}}</em>
+            <el-select
+              class="w200"
+              v-model="msg.BranchId"
+              filterable
+              :placeholder="$t('pub.pleaseSel')"
+              @change="linkageDepartment()"
+            >
+              <el-option :label="$t('pub.unlimitedSel')" value="-1"></el-option>
+              <el-option
+                v-for="item in companyList"
+                :label="item.BName"
+                :value="item.Id"
+                :key="item.Id"
+              ></el-option>
+            </el-select>
+          </span>
+        </li>
+        <li>
+          <span>
+            <em class="fl" style="margin-top: 10px!important;">{{$t('fnc.bmxuanze')}}</em>
+            <treeselect
+              class="w200 fl"
+              :options="departmentList"
+              v-model="msg.RB_Department_Id"
+              :label="$t('pub.unlimitedSel')"
+              :normalizer="normalizer"
+              @select="linkageEmployeeMsg"
+            />
+          </span>
+        </li>
+        <li>
+          <span>
+            <em>{{$t('fnc.ryxuanze')}}</em>
+          </span>
+          <el-select
+            class="w200"
+            v-model="msg.CreateBy"
+            filterable
+            :placeholder="$t('pub.pleaseSel')"
+          >
+            <el-option :label="$t('pub.unlimitedSel')" value="-1"></el-option>
+            <el-option
+              v-for="item in employeeList"
+              :label="item.name"
+              :value="item.empId"
+              :key="item.empId"
+            ></el-option>
+          </el-select>
+        </li>
+        <li>
+          <span>
+            <em>审批状态</em>
+            <el-select class="w200" v-model="msg.examineStatus">
+              <el-option label="不限" value="-1"></el-option>
+              <el-option label="待我审批" value="0"></el-option>
+              <el-option label="我已审批" value="1"></el-option>
+            </el-select>
+          </span>
+        </li>
+        <li>
+          <span>
+            <em>计划日期</em>
+            <el-date-picker
+              v-model="msg.timeRange"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </span>
+        </li>
+        <li>
+          <span>
+            <em>任务状态</em>
+            <el-select class="w200" v-model="msg.status">
+              <el-option label="不限" value="-2"></el-option>
+              <el-option label="未开始" value="-1"></el-option>
+              <el-option label="进行中" value="0"></el-option>
+              <el-option label="超时进行中" value="1"></el-option>
+              <el-option label="超时完成" value="2"></el-option>
+              <el-option label="正常完成" value="3"></el-option>
+            </el-select>
+          </span>
+        </li>
+        <li>
+          <input
+            type="button"
+            class="hollowFixedBtn"
+            :value="$t('pub.searchBtn')"
+            @click="getList();resetPageIndex()"
+          />
+          <button class="normalBtn" @click="exportFile()">导出</button>
+        </li>
+      </ul>
+    </div>
+    <div style="margin:10px 0;">
+      <span class="circle green"></span>
+      <span class="remark">进行中</span>
+      <span class="circle red"></span>
+      <span class="remark">超时</span>
+      <span class="circle black"></span>
+      <span class="remark">完成</span>
+      <span class="circle"></span>
+      <span class="remark">未开始</span>
+    </div>
+    <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
+      <tr>
+        <th>状态</th>
+        <th>标签</th>
+        <th>创建人</th>
+        <th>部门</th>
+        <th width="300">标题</th>
+        <th>内容概要</th>
+        <th>开始时间</th>
+        <th>截止时间</th>
+        <th>创建时间</th>
+        <th>立项审批信息</th>
+        <th>当前进度</th>
+        <th>完成审批信息</th>
+        <th>操作</th>
+      </tr>
+      <tr v-for="(item, index) in DataList" :key="index">
+        <td>
+          <span class="circle" v-if="item.ExamineStatus==0||item.ExamineStatus==-1"></span>
+          <span class="circle green" v-else-if="item.Status==0"></span>
+          <span class="circle red" v-else-if="item.Status==1||item.Status==2"></span>
+          <span class="circle black" v-else-if="item.Status==3"></span>
+        </td>
+        <td>
+          <el-tag v-if="item.Tags.length>0">{{item.Tags}}</el-tag>
+        </td>
+        <td>{{item.CreateName}}</td>
+        <td>{{item.DepartmentName}}</td>
+        <td>{{item.Title}}</td>
+        <td width="250">
+          <el-tooltip effect="dark" :content="item.Description" placement="top-start">
+            <span>{{item.Description.length>23?item.Description.substring(0,23)+"...":item.Description}}</span>
+          </el-tooltip>
+        </td>
+        <td>{{item.BeginTime}}</td>
+        <td>{{item.EndTime}}</td>
+        <td>{{item.CreateDate}}</td>
+        <td>
+          <span v-if="item.ExamineStatus==0" style="color:grey">审批中</span>
+          <span
+            v-else-if="item.ExamineStatus==1"
+            style="color:green;text-decoration: underline;"
+          >已通过</span>
+          <span v-else style="color:red;text-decoration: underline;">已驳回</span>
+        </td>
+        <td>
+          <el-progress
+            :text-inside="true"
+            :stroke-width="24"
+            :percentage="item.Progree"
+            status="success"
+          ></el-progress>
+        </td>
+        <td>
+          <span v-if="item.Status==2||item.Status==3">
+            <span v-if="item.FinishExamineStatus==0" style="color:grey">审批中</span>
+            <span
+              v-else-if="item.FinishExamineStatus==1"
+              style="color:green;text-decoration: underline;"
+            >已通过</span>
+            <span v-else style="color:red;text-decoration: underline;">已驳回</span>
+          </span>
+        </td>
+        <td>
+          <el-tooltip class="item" effect="dark" content="详情" placement="top-start">
+            <el-button
+              style="padding:4px"
+              type="info"
+              icon="el-icon-search"
+              @click.stop="query(item.Id)"
+              circle
+            ></el-button>
+          </el-tooltip>
+        </td>
+      </tr>
+    </table>
+    <el-pagination
+      background
+      @current-change="handleCurrentChange"
+      :current-page.sync="currentPage"
+      layout="total,prev, pager, next, jumper"
+      :page-size="msg.pageSize"
+      :total="total"
+    ></el-pagination>
+  </div>
+</template>
+
+<script>
+import Treeselect from "@riophae/vue-treeselect";
+import updateSalesMan from "../commonPage/updateSalesMan.vue";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import moment from 'moment'
+export default {
+  components: {
+    Treeselect
+  },
+  data() {
+    return {
+      normalizer(node) {
+        var obj = {
+          id: node.DepartmentId,
+          label: node.DepartmentName
+        };
+        if (node.ChildList != null && node.ChildList.length > 0) {
+          obj.children = node.ChildList;
+        }
+        return obj;
+      },
+      msg: {
+        BranchId: "-1",
+        RB_Department_Id: null,
+        pageIndex: 0,
+        pageSize: 10,
+        CreateBy: "-1",
+        examineStatus: "-1",
+        timeRange: [],
+        status:"-2"
+      },
+      getCompanyMsg: {
+        RB_Group_Id: "0",
+        Status: "0"
+      },
+      getDepartmentMsg: {
+        RB_Group_Id: "0",
+        RB_Branch_Id: "-1",
+        Status: "0"
+      },
+      employeeMsg: {
+        RB_Group_id: "0",
+        RB_Branch_id: "-1",
+        departmentId: "0",
+        IsLeave: "-1"
+      },
+      departmentList: [],
+      companyList: [],
+      employeeList: [],
+      userInfo: {},
+      datas: [],
+      currentPage: 1,
+      total: 0,
+      DataList: [],
+      loading: true
+    };
+  },
+  mounted() {
+    this.userInfo = this.getLocalStorage();
+    this.userId = this.userInfo.EmployeeId;
+    this.getCompanyMsg.RB_Group_Id = this.getDepartmentMsg.RB_Group_Id = this.userInfo.RB_Group_id; //集团
+    this.getCompany();
+    //this.getEmployee();
+  },
+  methods: {
+    exportFile(){
+      let msg = this.msg
+      msg.EmpId = this.userInfo.EmployeeId
+      let fileName =  "【" + moment(new Date()).format("YYYY-MM-DD HH:mm:ss") + "】工作计划.xls";
+      this.GetLocalFile("UserWork_GetUserWorkExportList", this.msg, fileName);
+    },
+    resetPageIndex() {
+      this.msg.pageIndex = 1;
+      this.currentPage = 1;
+    },
+    getList() {
+      //获取数据
+      this.loading = true;
+      console.log(this.msg.timeRange)
+      if(this.msg.timeRange && this.msg.timeRange.length==2){
+          this.msg.bt=this.msg.timeRange[0];
+          this.msg.et=this.msg.timeRange[1];
+      }else{
+          this.msg.bt="";
+          this.msg.et="";
+      }
+      this.apipost(
+        "user_post_GetWorkPageList",
+        this.msg,
+        res => {
+          this.loading = false;
+          if (res.data.resultCode == 1) {
+            this.DataList = res.data.data.pageData;
+            this.total = res.data.data.count;
+          } else {
+            this.$message.error(res.data.message);
+          }
+        },
+        err => {}
+      );
+    },
+    handleCurrentChange(val) {
+      this.msg.pageIndex = val;
+      this.getList();
+    },
+    getCompany() {
+      this.apipost(
+        "admin_get_BranchGetList",
+        this.getCompanyMsg,
+        res => {
+          if (res.data.resultCode == 1) {
+            this.companyList = res.data.data;
+            this.getEmployee();
+          } else {
+          }
+          this.getList();
+        },
+        err => {}
+      );
+    },
+    linkageEmployeeMsg(node, instanceId) {
+      this.employeeMsg.departmentId = node.DepartmentId;
+      this.msg.CreateBy = "-1";
+      this.getEmployee();
+    },
+    linkageDepartment() {
+      //联动部门
+      this.msg.RB_Department_Id = null;
+      if (this.msg.BranchId != 0) {
+        this.getDepartmentMsg.RB_Branch_Id = this.msg.BranchId;
+      }
+      this.getDepartment();
+    },
+    getDepartment() {
+      this.apipost(
+        "admin_Get_GetDepartmentTreeForReceiveQuery",
+        this.getDepartmentMsg,
+        res => {
+          if (res.data.resultCode == 1) {
+            this.departmentList = res.data.data;
+            if(res.data.data && res.data.data.length>0){
+              this.findMyDepartment(res.data.data[0]);
+            }
+            console.log(this.departmentList);
+          } else {
+            this.Error(res.data.message);
+          }
+        },
+        err => {}
+      );
+    },
+    findMyDepartment(data){
+      console.log(data)
+      if(data.DepartmentId==this.userInfo.RB_Department_Id){
+        console.log('yes',data)
+        this.changeDeparent(data)
+      }else{
+        if (data.ChildList && data.ChildList.length>0) {
+          data.ChildList.forEach(x => {
+            this.findMyDepartment(x)
+          });
+        }
+      }
+    },
+    changeDeparent(data){
+      let newDt=new Array();
+      newDt.push(data)
+       this.departmentList = newDt;
+    },
+    getEmployee() {
+      this.apipost(
+        "app_get_company_employee",
+        this.employeeMsg,
+        res => {
+          if (res.data.resultCode == 1) {
+            this.employeeList = res.data.data;
+          }
+        },
+        err => {}
+      );
+    },
+    query(id){
+      this.$router.push({
+        name: "workDetails",
+        query: {
+          "id": id,
+          blank: 'y'
+        }
+      })
+    },
+    query2(id){
+      this.$router.push({
+        name: "workDetails",
+        query: {
+          "id": id,
+          examine:"u",
+          blank: 'y'
+        }
+      })
+    }
+  }
+};
+</script>
+
+<style scope>
+.enrollTotalSearch {
+  width: 100%;
+  min-height: auto;
+  padding: 0 0 20px 0;
+}
+
+.enrollTotalSearch::after {
+  display: block;
+  clear: both;
+  content: "";
+  visibility: hidden;
+  height: 0;
+}
+
+.enrollTotalSearch li {
+  float: left;
+  font-size: 12px;
+  height: 40px;
+  color: #666;
+  margin: 20px 10px 10px 0;
+}
+
+.enrollTotalSearch li > span {
+  display: inline-block;
+}
+
+.enrollTotalSearch li span > em {
+  display: inline-block;
+  min-width: 60px;
+  text-align: right;
+  font-style: normal;
+  margin: 0 12px 0 0;
+}
+
+.enrollTotalSearch li:last-child {
+  float: right;
+  position: fixed;
+  top: 36px;
+  right: 20px;
+  text-align: right;
+  z-index: 50;
+}
+.circle {
+  width: 20px;
+  height: 20px;
+  display: inline-block;
+  text-align: center;
+  background: grey;
+  border-radius: 20px;
+  margin-right: 5px;
+}
+.circle.red {
+  background: #fe4433;
+}
+.circle.green {
+  background: green;
+}
+.circle.black {
+  background: black;
+}
+.remark {
+  margin-right: 20px;
+  font-size: 12px;
+  display: inline-block;
+  vertical-align: text-top;
+}
+.wd100 {
+  width: 100% !important;
+}
+.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>
\ No newline at end of file

src/router/config.js

@@ -4296,6 +4296,14 @@ export default {
                             meta: {
                                 title: '工作计划详情'
                             },
+                        },
+                        {
+                            path: '/workManager2',
+                            name: 'workManager2',
+                            component: resolve => require(['@/components/work/workManager2'], resolve),
+                            meta: {
+                                title: '工作计划详情'
+                            },
                         }
                     ]
                 },