5-10

src/api/childPlan.js

@@ -0,0 +1,37 @@
+import axios from 'axios';
+import qs from 'qs'
+//获取列表
+export function getPlanList(params){
+    return axios({
+        method: 'post',
+        url: '/planningItem/findByPlanningIdAndType',
+        data: qs.stringify(params)
+    }).then(res => res.data)
+}
+
+//新增
+export function addPlan(item) {
+    return axios({
+        method: 'post',
+        url: '/planningItem/addItem',
+        data: item
+    }).then(res => res.data)
+}
+
+//修改
+export function updatePlan(item) {
+    return axios({
+        method: 'post',
+        url: '/quarterly/update',
+        data: qs.stringify(item)
+    }).then(res => res.data)
+}
+
+//删除
+export function deletePlan(item) {
+    return axios({
+        method: 'post',
+        url: '/planningItem/deleteItem',
+        data: qs.stringify(item)
+    }).then(res => res)
+}

src/components/MainPage/Department/UserTree.vue

@@ -24,7 +24,11 @@ export default {
   name: 'UserTree',
   components: {
   },
-
+  props:{
+    showUser: {
+      type: Boolean, default: true
+    },
+  },
   data() {
     return {
       filterText: '',
@@ -48,16 +52,18 @@ export default {
 
   methods: {
     getTree(){
-      getTree(true).then((data) => {
+      getTree(this.showUser).then((data) => {
         this.departmentTree.push(data.data);
-        let tempList = [].concat(this.departmentTree);
-        while(tempList.length > 0){
-          let item = tempList.pop();
-          if(item.children.length == 0 && item.userList.length){
-            item.children = item.userList;
-          }
-          else{
-            tempList = tempList.concat(item.children);
+        if(this.showUser){
+          let tempList = [].concat(this.departmentTree);
+          while(tempList.length > 0){
+            let item = tempList.pop();
+            if(item.children.length == 0 && item.userList.length){
+              item.children = item.userList;
+            }
+            else{
+              tempList = tempList.concat(item.children);
+            }
           }
         }
       })
@@ -67,7 +73,7 @@ export default {
       return data.name.indexOf(value) !== -1;
     },
     getNode(val){
-        if(val.username){
+        if((this.showUser && val.username) || (!this.showUser && val.name)){
             this.$emit('chooseUser', val);
         }
     }

src/components/MainPage/Quarter.vue

@@ -48,10 +48,14 @@ table{
       width: 100px;
       text-align: right;
     }
-    /deep/ .el-input{
+    .el-textarea,.el-input,.el-select{
       display: inline-block;
       width: 300px;
     }
+    .text-label{
+      vertical-align: top;
+      margin-top: 10px;
+    }
   }
 }
 .center-text{
@@ -73,7 +77,7 @@ table{
     <thead>
             <tr>
                 <th>计划名</th>
-                <th style="min-width:50px">部门</th>
+                <!-- <th style="min-width:50px">部门</th> -->
                 <!-- <th>参与成员</th> -->
                 <th>年份</th>
                 <th style="width:50px">季度</th>
@@ -84,7 +88,7 @@ table{
         <tbody>
             <tr v-for="(item,index) in planeList" :key="index">
               <td>{{item.name}}</td>
-              <td>{{item.depart}}</td>
+              <!-- <td>{{item.depart}}</td> -->
               <!-- <td>{{item.member}}</td> -->
               <td>{{item.year}}</td>
               <td>{{item.quarter}}</td>
@@ -133,12 +137,12 @@ table{
           </el-select>
         </div>
         <div>
-          <label>内容：</label>
-          <el-input v-model="plan.content" placeholder="请输入内容" required="required" :disabled="noEdit"></el-input>
+          <label class="text-label">内容：</label>
+          <el-input v-model="plan.content" placeholder="请输入内容" required="required" :disabled="noEdit" type="textarea" :autosize="{ minRows: 5}"></el-input>
         </div>
         <span slot="footer" class="dialog-footer">
-            <el-button type="primary" @click="change" v-if="!noEdit">确 定</el-button>
             <el-button type="primary" @click="visibleChange = false;plan={}" v-if="!noEdit">取消</el-button>
+            <el-button type="primary" @click="change" v-if="!noEdit">确 定</el-button>
         </span>
     </el-dialog>
     <el-dialog
@@ -152,23 +156,23 @@ table{
       </span>
     </el-dialog>
     <el-drawer
-      title="子任务"
+      :title="plan.name + ' 子任务'"
       :visible.sync="childPlanFlag"
       direction="rtl"
-      size="50%">
-      <el-table :data="childPlan">
-          <el-table-column property="date" label="日期" width="150"></el-table-column>
-          <el-table-column property="name" label="姓名" width="200"></el-table-column>
-          <el-table-column property="address" label="地址"></el-table-column>
-        </el-table>
+      size="80%">
+      <ChildPlan :parentPlan = "plan" :showTable = "childPlanFlag"></ChildPlan>
     </el-drawer>
 </div>
 </template>
 
 <script>
 import { getPlanList,addPlan,updatePlan,deletePlan } from '@/api/quarter';
+import ChildPlan from "@/components/MainPage/Quarter/ChildPlan";
 export default {
   name: 'Quarter',
+  components: {
+    ChildPlan
+  },
   data () {
       return {
         params:{
@@ -185,7 +189,6 @@ export default {
         visibleDelete: false,
         noEdit: false,
         childPlanFlag: false,
-        childPlan: [],
       }
   },
   created() {
@@ -234,7 +237,7 @@ export default {
     },
     openChildPlan(item){
       this.childPlanFlag = true;
-      
+      this.plan = item;
     }
   }
 }

src/components/MainPage/Quarter/ChildPlan.vue

@@ -0,0 +1,208 @@
+<style lang="scss" scoped>
+.child-plan{
+
+}
+.dialog-style{
+  div{
+    text-align: center;
+    margin: 5px;
+    label{
+      display: inline-block;
+      width: 100px;
+      text-align: right;
+    }
+    .el-textarea,.el-input{
+      display: inline-block;
+      width: 300px;
+    }
+    .text-label{
+      vertical-align: top;
+      margin-top: 10px;
+    }
+  }
+}
+.add-bt{
+  padding: 15px;
+  text-align: right;
+}
+.el-icon-edit{
+  font-size: 20px;
+  cursor: pointer;
+}
+</style>
+<template>
+<div class="child-plan">
+  <el-table :data="childPlan">
+    <el-table-column property="name" label="计划"></el-table-column>
+    <el-table-column property="content" label="简要说明"></el-table-column>
+    <el-table-column property="departmentName" label="部门"></el-table-column>
+    <el-table-column fixed="right" label="操作" width="120">
+      <template slot-scope="scope">
+        <el-button @click="changeData(scope.row, true)" type="text" size="small">详情</el-button>
+        <el-button @click="changeData(scope.row, false)" type="text" size="small">修改</el-button>
+        <el-button @click="visibleDelete = true;plan.id = scope.row.id" type="text" size="small">删除</el-button>
+      </template></el-table-column>
+  </el-table>
+  <div class="add-bt">
+    <el-button type="primary" @click="addPlan">新增</el-button>
+  </div>
+  <el-dialog
+        class="dialog-style"
+        :title="noEdit?'详情':'编辑'"
+        :visible.sync="visibleChange"
+        :modal="false"
+        width="500px">
+        <div>
+          <label>名称：</label>
+          <el-input name="name" v-model="plan.name" placeholder="请输入名称" required="required" :disabled="noEdit"></el-input>
+        </div>
+        <div>
+          <label class="text-label">内容：</label>
+          <el-input v-model="plan.content" placeholder="请输入内容" required="required" :disabled="noEdit" type="textarea" :autosize="{ minRows: 5}"></el-input>
+        </div>
+        <div>
+          <label>部门：</label>
+          <el-input v-model="currentDepart.name" required="required" disabled style="width:280px"></el-input>
+          <i class="el-icon-edit" @click="departChange = true"></i>
+        </div>
+        <div>
+          <label class="text-label">备注：</label>
+          <el-input v-model="plan.remark" placeholder="请输入内容" :disabled="noEdit" type="textarea" :autosize="{ minRows: 2}"></el-input>
+        </div>
+        <span slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="visibleChange = false;plan={}" v-if="!noEdit">取消</el-button>
+            <el-button type="primary" @click="saveChildPlan" v-if="!noEdit">确 定</el-button>
+        </span>
+    </el-dialog>
+    <el-dialog
+      title="提示"
+      :visible.sync="visibleDelete"
+      :modal="false"
+      width="200px">
+      <p class="center-text">确认删除?</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="visibleDelete = false;plan={}">取 消</el-button>
+        <el-button type="primary" @click="deletePlan">确 定</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog
+      class="dialog-style"
+      title="切换部门"
+      :modal="false"
+      :visible.sync="departChange"
+      width="500px">
+      <p>选择：{{currentDepart.name}}</p>
+      <UserTree :showUser="false" @chooseUser="chooseDepart"></UserTree>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="departChange = false">取 消</el-button>
+        <el-button type="primary" @click="changeCheckDepart">确 定</el-button>
+      </span>
+    </el-dialog>
+</div>
+</template>
+
+<script>
+import { getPlanList,addPlan,updatePlan,deletePlan } from '@/api/childPlan';
+import UserTree from "@/components/MainPage/Department/UserTree";
+
+export default {
+  name: 'ChildPlan',
+  props:{
+    parentPlan: {},
+    showTable: {
+      type: Boolean,default: false,
+    }
+  },
+  data () {
+      return {
+        childPlan: [],
+        params:{
+          planningId: this.parentPlan.id,
+          type: 1
+        },
+        plan:{},
+        visibleChange: false,
+        visibleDelete: false,
+        noEdit: false,
+        departChange: false,
+        currentDepart: {
+          name:''
+        }
+      }
+  },
+  components:{
+    UserTree
+  },
+  created() {
+    this.getPlanList();
+  },
+  watch: {
+    showTable(val) {
+      if(val){
+        this.params.planningId = this.parentPlan.id;
+        this.getPlanList();
+      }
+    },
+  },
+  computed: {
+  },
+  methods: {
+    getPlanList(){
+      getPlanList(this.params).then((data) => {
+        this.childPlan = data.data;
+      })
+    },
+    addPlan(){
+      this.visibleChange = true;
+      this.noEdit = false;
+      this.plan = {
+        content: '',
+        departmentId: '',
+        name: '',
+        planningId: this.parentPlan.id,
+        remark: '',
+        type: 1,
+      };
+      this.currentDepart.name = '';
+    },
+    deletePlan(){
+      deletePlan(this.plan).then((result) => {
+        alert(result?'删除成功':'删除失败');
+        this.visibleDelete = false;
+        this.plan = {};
+        this.getPlanList();
+      })
+    },
+    changeData(item,flag){
+      this.visibleChange = true;
+      this.noEdit = flag;
+      this.plan = JSON.parse(JSON.stringify( item ));
+    },
+    saveChildPlan(){
+      if(this.plan.id){
+        updatePlan(this.plan).then((result) => {
+          alert(result.result?'更新成功':'更新失败');
+          this.visibleChange = false;
+          this.plan = {};
+          this.getPlanList();
+        })
+      }
+      else{
+        addPlan(this.plan).then((result) => {
+          alert(result.result?'添加成功':'添加失败');
+          this.visibleChange = false;
+          this.plan = {};
+          this.getPlanList();
+        })
+      }
+    },
+    chooseDepart(val){
+      this.currentDepart = val;
+    },
+    changeCheckDepart(){
+      this.plan.departmentId = this.currentDepart.id;
+      this.departChange = false;
+    }
+  }
+}
+</script>

src/components/MainPage/Year.vue

@@ -48,10 +48,14 @@ table{
       width: 100px;
       text-align: right;
     }
-    /deep/ .el-input{
+    .el-textarea,.el-input{
       display: inline-block;
       width: 300px;
     }
+    .text-label{
+      vertical-align: top;
+      margin-top: 10px;
+    }
   }
 }
 .center-text{
@@ -109,12 +113,12 @@ table{
           </el-date-picker>
         </div>
         <div>
-          <label>内容：</label>
-          <el-input v-model="plan.content" placeholder="请输入内容" required="required"></el-input>
+          <label class="text-label">内容：</label>
+          <el-input v-model="plan.content" placeholder="请输入内容" required="required" type="textarea" :autosize="{ minRows: 5}"></el-input>
         </div>
         <span slot="footer" class="dialog-footer">
-            <el-button type="primary" @click="change">确 定</el-button>
             <el-button type="primary" @click="visibleChange = false;plan={}">取消</el-button>
+            <el-button type="primary" @click="change">确 定</el-button>
         </span>
     </el-dialog>
     <el-dialog