班组成员

src/views/mes/cal/team/index.vue

@@ -71,7 +71,15 @@
 
     <el-table v-loading="loading" :data="teamList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="班组编号" align="center" prop="teamCode" />
+      <el-table-column label="班组编号" align="center" prop="teamCode" >
+          <template slot-scope="scope">
+                <el-button              
+                  type="text"
+                  @click="handleView(scope.row)"
+                  v-hasPermi="['mes:cal:team:query']"
+                >{{scope.row.teamCode}}</el-button>
+          </template>
+      </el-table-column>
       <el-table-column label="班组名称" align="center" prop="teamName" />
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
@@ -135,6 +143,7 @@
         </el-row>
       </el-form>
       <el-divider v-if="form.teamId !=null" content-position="center">项目组成员</el-divider>
+      <Teammember v-if="form.teamId !=null" :optType="optType" :teamId="form.teamId"></Teammember>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="cancel" v-if="optType =='view'">返回</el-button>
         <el-button type="primary" @click="submitForm" v-else>确 定</el-button>
@@ -146,9 +155,11 @@
 
 <script>
 import { listTeam, getTeam, delTeam, addTeam, updateTeam } from "@/api/mes/cal/team";
+import Teammember from "./member";
 import {genCode} from "@/api/system/autocode/rule"
 export default {
   name: "Team",
+  components: {Teammember},
   data() {
     return {
       //自动生成编码
@@ -249,6 +260,18 @@ export default {
       this.reset();
       this.open = true;
       this.title = "添加班组";
+      this.optType = "add";
+    },
+        // 查询明细按钮操作
+    handleView(row){
+      this.reset();
+      const teamId = row.teamId || this.ids
+      getTeam(teamId).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "查看班组";
+        this.optType = "view";
+      });
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
@@ -258,6 +281,7 @@ export default {
         this.form = response.data;
         this.open = true;
         this.title = "修改班组";
+        this.optType = "edit";
       });
     },
     /** 提交按钮 */

src/views/mes/cal/team/member.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-row :gutter="10" class="mb8">
+    <el-row v-if="optType !='view'" :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
           type="primary"
@@ -10,17 +10,7 @@
           @click="handleAdd"
           v-hasPermi="['mes:cal:team:add']"
         >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['mes:cal:team:edit']"
-        >修改</el-button>
+        <UserMultiSelect ref="userSelect" @onSelected="userSelected"></UserMultiSelect>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -51,15 +41,8 @@
       <el-table-column label="用户名" align="center" prop="userName" />
       <el-table-column label="用户昵称" align="center" prop="nickName" />
       <el-table-column label="电话" align="center" prop="tel" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center" v-if="optType !='view'" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['cal:teammember:edit']"
-          >修改</el-button>
           <el-button
             size="mini"
             type="text"
@@ -78,36 +61,19 @@
       :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="userName">
-          <el-input v-model="form.userName" placeholder="请输入用户名" />
-        </el-form-item>
-        <el-form-item label="用户昵称" prop="nickName">
-          <el-input v-model="form.nickName" placeholder="请输入用户昵称" />
-        </el-form-item>
-        <el-form-item label="电话" prop="tel">
-          <el-input v-model="form.tel" placeholder="请输入电话" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" type="textarea" 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>
   </div>
 </template>
 
 <script>
-import { listTeammember, getTeammember, delTeammember, addTeammember, updateTeammember } from "@/api/mes/cal/teammember";
-
+import { listTeammember, getTeammember, delTeammember, addTeammember } from "@/api/mes/cal/teammember";
+import UserMultiSelect from "@/components/userSelect/multi.vue"
 export default {
   name: "Teammember",
+  components: {UserMultiSelect},
+  props:{
+    teamId:null,
+    optType:null
+  },
   data() {
     return {
       // 遮罩层
@@ -132,7 +98,7 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        teamId: null,
+        teamId: this.teamId,
         userId: null,
         userName: null,
         nickName: null,
@@ -140,18 +106,6 @@ export default {
       },
       // 表单参数
       form: {},
-      // 表单校验
-      rules: {
-        teamId: [
-          { required: true, message: "班组ID不能为空", trigger: "blur" }
-        ],
-        userId: [
-          { required: true, message: "用户ID不能为空", trigger: "blur" }
-        ],
-        userName: [
-          { required: true, message: "用户名不能为空", trigger: "blur" }
-        ],
-      }
     };
   },
   created() {
@@ -211,44 +165,29 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
-      this.reset();
+      this.$refs.userSelect.showFlag = true;
       this.open = true;
       this.title = "添加班组成员";
     },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const memberId = row.memberId || this.ids
-      getTeammember(memberId).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改班组成员";
-      });
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.memberId != null) {
-            updateTeammember(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addTeammember(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
-        }
-      });
+    userSelected(rows){
+      if(rows !=null){
+        rows.forEach(user => {
+          this.form.teamId = this.teamId;
+          this.form.userId = user.userId;
+          this.form.userName = user.userName;
+          this.form.nickName = user.nickName;
+          this.form.tel = user.phonenumber;  
+          addTeammember(this.form).then(response => {              
+            this.getList();  
+          });
+        });
+      }
     },
+
     /** 删除按钮操作 */
     handleDelete(row) {
       const memberIds = row.memberId || this.ids;
-      this.$modal.confirm('是否确认删除班组成员编号为"' + memberIds + '"的数据项？').then(function() {
+      this.$modal.confirm('是否确认删除班组成员？').then(function() {
         return delTeammember(memberIds);
       }).then(() => {
         this.getList();
@@ -257,7 +196,7 @@ export default {
     },
     /** 导出按钮操作 */
     handleExport() {
-      this.download('cal/teammember/export', {
+      this.download('mes/cal/teammember/export', {
         ...this.queryParams
       }, `teammember_${new Date().getTime()}.xlsx`)
     }