完成修改岗位功能

src/components/CreatePersonDialog.vue

@@ -2,64 +2,61 @@
   <!-- Form -->
 
   <el-dialog
-    title="添加成员"
+      title="添加成员"
-    :before-close="handleClose"
+      :before-close="handleClose"
-    v-model="dialogFormVisible"
+      v-model="dialogFormVisible"
-    center
+
+      width="500px"
   >
     <el-form :model="form" :rules="rules" ref="form">
-      <el-row>
+
-        <el-col :span="24">
+      <el-form-item
-          <el-form-item
+          label="用户名"
-            label="用户名"
+          prop="staffUsername"
-            prop="staffUsername"
+          :label-width="formLabelWidth"
-            :label-width="formLabelWidth"
+      >
-          >
+        <el-input
-            <el-input
+            v-model="form.staffUsername"
-              v-model="form.staffUsername"
+            autocomplete="off"
-              autocomplete="off"
+        ></el-input>
-            ></el-input>
+      </el-form-item>
-          </el-form-item>
+
-        </el-col>
+
-      </el-row>
+      <el-form-item label="岗位" :label-width="formLabelWidth">
-      <el-row>
+        <div style="display: flex;flex-direction: row; flex-wrap: wrap">
-        <el-col :span="24">
+          <el-tag
-          <el-form-item label="岗位" :label-width="formLabelWidth">
+              style="margin-left: 0;font-size: 14px"
-            <!--        <el-input v-model="form.name" autocomplete="off"></el-input>-->
-            <el-input
-              class="input-new-tag"
-              v-model="inputValue"
-              ref="saveTagInput"
-              @keyup.enter="handleInputConfirm"
-              @blur="handleInputConfirm"
-            >
-            </el-input>
-            <el-tag
               :key="tag"
               v-for="tag in dynamicTags"
               closable
               :disable-transitions="false"
               @close="handleClose2(tag)"
-            >
+              size="large"
-              {{ tag }}
+          >
-            </el-tag>
+            {{ tag }}
+          </el-tag>
+          <el-input
+              style="width: 100px"
+              v-if="inputVisible"
+              v-model="inputValue"
+              ref="saveTagInput"
+              @keyup.enter="handleInputConfirm"
+              @blur="handleInputConfirm"
+          >
+          </el-input>
+          <el-button v-else class="button-new-tag ml-1" style="margin-left: 0"  @click="showInput">
+            + 添加岗位
+          </el-button>
+        </div>
+
+      </el-form-item>
 
-            <!-- <el-button
-              v-else
-              class="button-new-tag"
-              size="small"
-              @click="showInput"
-              >+ New Tag</el-button
-            > -->
-          </el-form-item>
-        </el-col>
-      </el-row>
     </el-form>
     <template #footer>
       <span class="dialog-footer">
         <el-button type="primary" @click="submitFormData('form')">确定</el-button>
 
-        <el-button @click="onCannel()">取 消</el-button>
+        <el-button @click="onCancel()">取消</el-button>
         <!--      <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>-->
       </span>
     </template>
@@ -68,6 +65,7 @@
 
 <script>
 import request from "../utils/request";
+
 export default {
   data() {
     return {
@@ -81,7 +79,7 @@ export default {
       inputValue: "",
       rules: {
         staffUsername: [
-          { required: true, message: "请输入用户名", trigger: "blur" },
+          {required: true, message: "请输入用户名", trigger: "blur"},
         ],
       },
     };
@@ -101,12 +99,12 @@ export default {
       });
     },
     handleClose() {
-      this.onCannel();
+      this.onCancel();
     },
-    onCannel() {
+    onCancel() {
       this.form.staffUsername = "";
       this.dynamicTags = [];
-      this.$emit("onCannel");
+      this.$emit("onCancel");
     },
     handleInputConfirm() {
       let inputValue = this.inputValue;
@@ -134,28 +132,27 @@ export default {
             const param = {
               staffUsername: this.form.staffUsername,
               projectStaffPosition: this.dynamicTags.join(","),
-              staffId: 0,
             };
             request({
               url: `/project/${projectId}/group`,
               method: "post",
               data: param,
             })
-              .then(
+                .then(
-                (res) => {
+                    (res) => {
-                  console.log("submit!!");
+                      console.log("submit!!");
-                  this.$message.success("添加成功");
+                      this.$message.success("添加成功");
-                  this.$emit("createdPerson");
+                      this.$emit("createdPerson");
-                  this.form.staffUsername = "";
+                      this.form.staffUsername = "";
-                  this.dynamicTags = [];
+                      this.dynamicTags = [];
-                },
+                    },
-                (err) => {
+                    (err) => {
-                  this.$message.error("添加失败");
+                      this.$message.error("添加失败");
-                }
+                    }
-              )
+                )
-              .catch(function (error) {
+                .catch(function (error) {
-                console.log(error);
+                  console.log(error);
-              });
+                });
           } else {
             console.log("error submit!!");
             return false;
@@ -173,6 +170,7 @@ export default {
   margin-right: 10px;
   margin-bottom: 5px;
 }
+
 .button-new-tag {
   margin-left: 10px;
   height: 32px;
@@ -180,6 +178,7 @@ export default {
   padding-top: 0;
   padding-bottom: 0;
 }
+
 .input-new-tag {
   width: 90px;
   /* margin-left: 10px; */

src/components/EditJobDialog.vue

@@ -0,0 +1,142 @@
+<template>
+  <el-dialog
+      title="修改岗位"
+      :before-close="handleClose"
+      v-model="dialogFormVisible"
+      width="500px"
+  >
+    <div style="display: flex;flex-direction: row; flex-wrap: wrap">
+      <el-tag
+          style="margin-left: 0;font-size: 14px"
+          :key="tag"
+          v-for="tag in dynamicTags"
+          closable
+          :disable-transitions="false"
+          @close="handleClose2(tag)"
+          size="large"
+      >
+        {{ tag }}
+      </el-tag>
+      <el-input
+          style="width: 100px"
+          v-if="inputVisible"
+          v-model="inputValue"
+          ref="saveTagInput"
+          @keyup.enter="handleInputConfirm"
+          @blur="handleInputConfirm"
+      >
+      </el-input>
+      <el-button v-else class="button-new-tag ml-1" style="margin-left: 0" @click="showInput">
+        + 添加岗位
+      </el-button>
+    </div>
+
+
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submit()">确定</el-button>
+
+        <el-button @click="onCancel()">取消</el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+
+<script>
+import request from "../utils/request";
+
+export default {
+  name: "EditJobDialog",
+  data() {
+    return {
+      //标签
+      dynamicTags: [],
+      inputVisible: false,
+      inputValue: "",
+    };
+  },
+  props: {
+    dialogFormVisible: Boolean,
+    staffId: Number,
+    projectStaffPosition: String
+  },
+  watch: {
+    projectStaffPosition: function (val) {
+      this.dynamicTags = val.split(',')
+    },
+  },
+  methods: {
+    handleClose2(tag) {
+      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
+    },
+
+    showInput() {
+      this.inputVisible = true;
+      this.$nextTick((_) => {
+        this.$refs.saveTagInput.$refs.input.focus();
+      });
+    },
+    handleClose() {
+      this.onCancel();
+    },
+    onCancel() {
+      this.dynamicTags = [];
+      this.$emit("onCancel");
+    },
+    handleInputConfirm() {
+      let inputValue = this.inputValue;
+      if (inputValue) {
+        const isCF = !!this.dynamicTags.find((item) => {
+          return item == inputValue;
+        });
+        if (isCF) {
+          this.$message.warning("岗位不能重复");
+        } else {
+          this.dynamicTags.push(inputValue);
+        }
+      }
+      this.inputVisible = false;
+      this.inputValue = "";
+    },
+    submit() {
+      if (this.dynamicTags?.length) {
+
+
+        let projectId = this.$route.params.projectId;
+        const param = {
+          projectStaffPosition: this.dynamicTags.join(","),
+        };
+        request({
+          url: `/project/${projectId}/group/${this.staffId}`,
+          method: "put",
+          data: param,
+        })
+            .then(
+                (res) => {
+                  console.log("submit!!");
+                  this.$message.success("修改成功");
+                  this.$emit("edited");
+                  this.form.staffUsername = "";
+                  this.dynamicTags = [];
+                },
+                (err) => {
+                  this.$message.error("修改失败");
+                }
+            )
+            .catch(function (error) {
+              console.log(error);
+            });
+
+
+      } else {
+        this.$message.warning("请添加岗位");
+      }
+    },
+  },
+};
+</script>
+
+<style scoped>
+
+</style>

src/components/TransferDialog.vue

@@ -0,0 +1,23 @@
+<template>
+  <el-dialog
+      title="交接"
+      v-model="dialogVisible"
+      width="1000px"
+  >
+
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: "TransferDialog",
+  props: {
+    dialogVisible: Boolean,
+    staffId: Number,
+  },
+}
+</script>
+
+<style scoped>
+
+</style>

src/utils/baseUrl.js

@@ -2,4 +2,5 @@
 //const baseUrl = "http://36.5.61.1:8081/"
 //const baseUrl = "http://101.34.228.45:8080/api/"
 const baseUrl = "https://www.hammer-hfut.tk/api/"
+//const baseUrl = "http://192.168.209.129:8081/"
 export default baseUrl;

src/utils/request.js

@@ -40,8 +40,6 @@ request.interceptors.response.use(
             store.commit('clearStaff')
             router.push({path: '/login'})
         }
-
-
         return Promise.reject(error)
     });
 export default request

src/views/ProjectGroup.vue

@@ -2,7 +2,7 @@
   <div ref="divRef" style="display: flex;margin: 0 30px 0 30px;height: 100%;justify-content: space-around;">
 
     <div ref="leftRef" style="width: 50%;height: 100%;padding: 0 30px 0 0;display: flex;flex-direction: column">
-      <div style="display: flex;flex-direction: row;justify-content: space-between" ref="left_title_Ref">
+      <div style="margin: 0 10px 0 10px;display: flex;flex-direction: row;justify-content: space-between" ref="left_title_Ref">
         <p style="text-align:center; 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">项目团队</p>
         <el-button type="primary" @click="onCreatePerson">新增成员</el-button>
       </div>
@@ -10,43 +10,22 @@
               display: flex;flex-direction: column;justify-content: space-between">
         <el-table
             ref="tableRef"
-            class="projectTable"
             :height="tableHeight"
             :data="tableData"
         >
-          <el-table-column prop="staffFullname" label="姓名" min-width="25%">
+          <el-table-column prop="staffFullname" label="姓名" min-width="25%"/>
-          </el-table-column>
+          <el-table-column prop="projectStaffPosition" label="职位" min-width="40%" :formatter="jobFormatter"/>
-          <el-table-column
+          <el-table-column align="right" min-width="35%">
-              prop="projectStaffPosition"
-              label="职位"
-              min-width="45%"
-          >
-          </el-table-column>
-          <el-table-column fixed="right" label="操作" min-width="30%">
             <template #default="scope">
-            <span>
+              <div style="width: 100%;display: flex;flex-direction: row;justify-content: flex-end">
-              <el-button
+                <el-button
-                  @click.prevent="deleteRow(scope.$index, tableData)"
+                    @click.native="onEditClick(scope.row)"
-                  type="text"
+                    type="primary" link>修改</el-button>
-                  size="midium"
+                <el-button
-              >
+                    type="primary" link>交接</el-button>
-                修改
+                <el-button
-              </el-button>
+                    type="primary" link>离队</el-button>
-              <el-button
+              </div>
-                  @click.prevent="deleteRow(scope.$index, tableData)"
-                  type="text"
-                  size="midium"
-              >
-                交接
-              </el-button>
-              <el-button
-                  @click.prevent="deleteRow(scope.$index, tableData)"
-                  type="text"
-                  size="midium"
-              >
-                离队
-              </el-button>
-            </span>
             </template>
           </el-table-column>
         </el-table>
@@ -76,13 +55,15 @@
     </div>
     <div style="width: 50%;display: flex;flex-direction: column;height: 100%;">
       <div style="margin-top: 5px;display: flex;flex-direction: column;height: 100%">
-        <p style="'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266;margin: 0 0 30px 0;flex-shrink: 0;">岗位统计</p>
+        <p style="'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266;margin: 0 0 30px 0;flex-shrink: 0;">
+          岗位统计</p>
         <div style="flex: 1;background-color: white; border-radius: 10px;">
           <EchartsPie id="pie_post" ref="pie_post" :isLegend="true" :dataList="stationList"/>
         </div>
-        <p style="'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266;margin: 15px 0 30px 0;flex-shrink: 0;">团队工作情况统计</p>
+        <p style="'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266;margin: 15px 0 30px 0;flex-shrink: 0;">
+          团队工作情况统计</p>
         <div style="flex: 1;background-color: white; border-radius: 10px;">
-<!--          <EchartsPie id="pie_team" :isRadius="true" />-->
+          <!--          <EchartsPie id="pie_team" :isRadius="true" />-->
         </div>
       </div>
     </div>
@@ -90,8 +71,15 @@
   <CreatePersonDialog
       v-model:dialogFormVisible="dialogFormVisible"
       @createdPerson="rehushTableData"
-      @onCannel="dialogFormVisible = false"
+      @onCancel="dialogFormVisible = false"
   ></CreatePersonDialog>
+  <EditJobDialog
+      v-model:dialogFormVisible="editJobDialogVisible"
+      :staffId="editStaffId"
+      :projectStaffPosition="editStaffPosition"
+      @edited="rehushTableData"
+      @onCancel="editJobDialogVisible = false"
+  ></EditJobDialog>
 </template>
 
 <script setup>
@@ -130,9 +118,30 @@ onMounted(() => {
 import EchartsPie from "../components/echartsPie";
 import request from "../utils/request";
 import CreatePersonDialog from "../components/CreatePersonDialog";
+import EditJobDialog from "../components/EditJobDialog";
+
 export default {
+  name: 'ProjectGroup',
+  data() {
+    return {
+      // 岗位列表
+      stationList: [],
+      total: 20,
+      currentPage: 1,
+      pageSize: 10,
+      dialogFormVisible: false,
+
+      editJobDialogVisible: false,
+      editStaffId: Number,
+      editStaffPosition: String,
+
+      tableData: [],
+
+    };
+  },
   components: {
     CreatePersonDialog,
+    EditJobDialog,
     EchartsPie
   },
   methods: {
@@ -148,7 +157,7 @@ export default {
               let data = response.data.data;
               let array = [];
               for (let key in data) {
-                array.push({ value: data[key], name: key });
+                array.push({value: data[key], name: key});
               }
               this.stationList = array;
               this.$nextTick(() => {
@@ -165,8 +174,10 @@ export default {
       this.dialogFormVisible = true;
     },
 
-    deleteRow(index, rows) {
+    onEditClick(row) {
-      rows.splice(index, 1);
+      this.editStaffId = row.staffId
+      this.editStaffPosition= row.projectStaffPosition
+      this.editJobDialogVisible = true
     },
     // 选择一页显示多少条数据
     handleSizeChange(val) {
@@ -181,6 +192,7 @@ export default {
     },
     rehushTableData() {
       this.dialogFormVisible = false;
+      this.editJobDialogVisible = false
       const data = {
         pageCurrent: this.currentPage,
         pageSize: this.pageSize,
@@ -226,6 +238,9 @@ export default {
       };
       this.getTableData(data);
     },
+    jobFormatter(row, column) {
+      return row[column.property].replace(',','，');
+    },
   },
   mounted() {
     this.getStationList();
@@ -237,29 +252,17 @@ export default {
     };
     this.getTableData(param);
   },
-  data() {
+
-    return {
-      // 岗位列表
-      stationList: [],
-      total: 20,
-      currentPage: 1,
-      pageSize: 10,
-      dialogFormVisible: false,
-      tableData: [],
-    };
-  },
 };
 </script>
 
 <style scoped>
-.projectTable {
+
-  border-radius: 10px;
+
-  padding: 10px;
-  box-sizing: border-box;
-}
 .pie_postBox {
   border-radius: 10px;
 }
+
 #echartsPie {
   border-radius: 10px;
 }

src/views/ProjectWorkitem.vue

@@ -4,7 +4,7 @@
     <div style="margin: 0 40px 0 40px;
                 display: flex;flex-direction: row;justify-content: space-between">
       <!--      <p style="font-family: 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">工作项</p>-->
-      <el-dropdown>
+      <el-dropdown @command="handleCommand">
         <span style="font-family: 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">
           工作项
           <el-icon class="el-icon--right">
@@ -13,8 +13,8 @@
         </span>
         <template #dropdown>
           <el-dropdown-menu>
-            <el-dropdown-item>所有工作项</el-dropdown-item>
+            <el-dropdown-item command="all">所有工作项</el-dropdown-item>
-            <el-dropdown-item>我的工作项</el-dropdown-item>
+            <el-dropdown-item command="mine">我的工作项</el-dropdown-item>
           </el-dropdown-menu>
         </template>
       </el-dropdown>
@@ -185,6 +185,7 @@
       :title="form.title"
       width="40%"
       top="60px"
+      @closed="dialogVisible=false"
   >
     <el-form ref="formRef" :model="form" label-position="top" label-width="120px" :rules="rules">
       <el-row :gutter="20">
@@ -353,6 +354,7 @@ export default {
   },
   data() {
     return {
+      mine: false,
       dialogVisible: false,
       form: {},
       rules: {
@@ -390,7 +392,32 @@ export default {
       this.getWorkitems() // 接收父组件的值
     },
     projectGroup: function (val) {
-
+    },
+    mine: function (val) {
+      if(val)
+      {
+        const that = this;
+        request({
+          url: 'project/' + this.$route.params.projectId + '/task/mine',
+          method: 'get',
+        }).then(response => {
+          if (response.data.code === 200) {
+            //console.log(response.data.records)
+            that.workitems = response.data.data.records
+            for (let workitem of that.workitems) {
+              workitem['editable'] = that.projectAccessLevel < 3
+              //console.log(workitem)
+            }
+            //console.log(that.workitems)
+          }
+        }).catch(function (error) {
+          console.log(error)
+        })
+      }
+      else
+      {
+        this.getWorkitems()
+      }
     }
   },
   created() {
@@ -398,6 +425,21 @@ export default {
       this.getWorkitems()
   },
   methods: {
+
+
+    handleCommand(command) {
+      switch (command)
+      {
+        case 'mine':
+          this.mine = true;
+          break;
+        default:
+          this.mine = false;
+          break;
+      }
+    },
+
+
     statusDisabled(row) {
       return row.taskStatus==='已完成'||row.taskStatus==='关闭'||!(row.editable ||
           (this.$store.state.staff && row.taskHolderId === this.$store.state.staff.staffId))
@@ -488,11 +530,11 @@ export default {
         else
           Promise.reject(response)
       }).catch(function (error) {
-        console.log(error.data)
+        console.log(error.response.data)
         let msg = '修改失败，'
-        if(error.data&&error.data.msg)
+        if(error.response.data&&error.response.data.msg)
         {
-          msg+=error.data.msg
+          msg+=error.response.data.msg
         }
         else
           msg+='未知错误'
@@ -500,6 +542,8 @@ export default {
           message: msg,
           type: 'error',
         })
+
+
         if (submitForm.taskFatherId === 0) {
           that.getWorkitems()
         } else {