点击队伍名跳转到队伍信息及成员信息显示页面

ruoyi-admin/src/main/java/com/ruoyi/web/controller/ehs/EhsRescueTeamWorkerController.java

@@ -1,5 +1,6 @@
 package com.ruoyi.web.controller.ehs;
 
+import com.baomidou.mybatisplus.core.metadata.TableInfo;
 import com.ruoyi.common.annotation.Log;
 import com.ruoyi.common.core.controller.BaseController;
 import com.ruoyi.common.core.domain.AjaxResult;
@@ -83,6 +84,16 @@ public class EhsRescueTeamWorkerController extends BaseController {
         return success(teamResponseVo);
     }
 
+    /**
+     * 根据队伍id获取人员信息(分页)
+     */
+    @GetMapping("/listWorker/{rescueTeamId}")
+    public TableDataInfo listWorker(@PathVariable("rescueTeamId") Long rescueTeamId) {
+        startPage();
+        List<EhsRescueTeamWorker> list = ehsRescueTeamWorkerService.listWorker(rescueTeamId);
+        return getDataTable(list);
+    }
+
     /**
      * 新增应急救援队人员信息
      */

ruoyi-system/src/main/java/com/ruoyi/ehsRescueTeam/service/impl/EhsRescueTeamServiceImpl.java

@@ -37,7 +37,13 @@ public class EhsRescueTeamServiceImpl extends ServiceImpl<EhsRescueTeamMapper, E
      */
     @Override
     public EhsRescueTeam selectEhsRescueTeamById(Long id) {
-        return ehsRescueTeamMapper.selectEhsRescueTeamById(id);
+        EhsRescueTeam teamInfo = ehsRescueTeamMapper.selectEhsRescueTeamById(id);
+        // 设置队伍人数信息
+        Long count = ehsRescueTeamMapper.getWorkerNumByTeamId(id);
+        if (count != null){
+            teamInfo.setRescueWorkerNum(count);
+        }
+        return teamInfo;
     }
 
 

ruoyi-system/src/main/java/com/ruoyi/ehsRescueTeamWorker/mapper/EhsRescueTeamWorkerMapper.java

@@ -33,4 +33,6 @@ public interface EhsRescueTeamWorkerMapper extends BaseMapper<EhsRescueTeamWorke
 
     // 根据teamId更新应急救援人员信息
     public boolean updateWorkerByTeamId(EhsRescueTeamWorker worker);
+
+    List<EhsRescueTeamWorker> listWorker(Long rescueTeamId);
 }

ruoyi-system/src/main/java/com/ruoyi/ehsRescueTeamWorker/service/IEhsRescueTeamWorkerService.java

@@ -39,4 +39,9 @@ public interface IEhsRescueTeamWorkerService extends IService<EhsRescueTeamWorke
 
     // 根据teamId更新应急救援人员信息
     public boolean updateWorkerByTeamId(EhsRescueTeam ehsRescueTeam);
+
+    /**
+     * 根据队伍id获取人员信息(分页)
+     */
+    List<EhsRescueTeamWorker> listWorker(Long rescueTeamId);
 }

ruoyi-system/src/main/java/com/ruoyi/ehsRescueTeamWorker/service/impl/EhsRescueTeamWorkerServiceImpl.java

@@ -126,6 +126,14 @@ public class EhsRescueTeamWorkerServiceImpl extends ServiceImpl<EhsRescueTeamWor
         return ehsRescueTeamWorkerMapper.updateWorkerByTeamId(worker);
     }
 
+    /**
+     * 根据队伍id获取人员信息(分页)
+     */
+    @Override
+    public List<EhsRescueTeamWorker> listWorker(Long rescueTeamId) {
+        return ehsRescueTeamWorkerMapper.listWorker(rescueTeamId);
+    }
+
 
     private LambdaQueryWrapper<EhsRescueTeamWorker> buildQueryWrapper(EhsRescueTeamWorker query) {
         Map<String, Object> params = query.getParams();

ruoyi-system/src/main/resources/mapper/ehs/EhsRescueTeamWorkerMapper.xml

@@ -62,6 +62,10 @@
             <include refid="selectEhsRescueTeamWorkerVo"/>
             where id = #{id}
     </select>
+    <select id="listWorker" resultType="com.ruoyi.ehsRescueTeamWorker.domain.EhsRescueTeamWorker">
+        <include refid="selectEhsRescueTeamWorkerVo"/>
+        where rescue_team_id = #{rescueTeamId}
+    </select>
 
     <delete id="removeWorkerByTeamIds">
         delete from ehs_rescue_team_worker

ruoyi-ui/src/api/ehs/realdata.js

@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+//   详情
+export const getXq = (id) => {
+    return request({
+      url: '/ehs/ehsRescueTeam/'+id,
+      method: 'get',
+    })
+}
+
+// 获取人员信息
+
+export const getWorkerInfo = (rescueTeamId) => {
+  return request({
+    url: '/ehs/ehsRescueTeamWorker/listWorker/' + rescueTeamId,
+    method: 'get',
+  })
+}

ruoyi-ui/src/views/ehs/ehsRescueTeam/index.vue

@@ -145,7 +145,22 @@
           <span>{{ Number(scope.$index) + 1 }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="队伍名称" align="center" prop="teamName" />
+
+      <el-table-column
+        label="队伍名称"
+        align="center"
+        prop="teamName"
+      >
+        <template slot-scope="scope">
+            <span
+              @click="getTeamInfoDetail(scope.row)"
+              style="color: blue; cursor: pointer"
+            >{{ scope.row.teamName }}</span
+            >
+        </template>
+      </el-table-column>
+
+<!--      <el-table-column label="队伍名称" align="center" prop="teamName" />-->
       <el-table-column label="队伍级别" align="center" prop="teamLevel"  >
       <template slot-scope="scope">
         <dict-tag :options="dict.type.team_level" :value="scope.row.teamLevel"/>
@@ -273,6 +288,13 @@
       downUrl="/ehs/ehsRescueTeam/importTemplate"
       temName="应急救援队伍导入模板"
     ></importUpload>
+
+    <!-- 队伍表详情 -->
+    <realDetail
+      ref="realDetailRef"
+      :detailData="detailDataTeam"
+      :readParams="readParams"
+    ></realDetail>
   </div>
 </template>
 
@@ -282,11 +304,14 @@ import { listEhsRescueTeamWorker, getEhsRescueTeamWorker, delEhsRescueTeamWorker
 import importUpload from "@/components/upload/upload";
 import tdh from "../ehsRescueTeamWorker/index.vue"
 import {listAllDept,selectPartDept } from "@/api/system/dept";
+import { getXq } from "@/api/ehs/realdata.js";
+import realDetail from "./realDetail.vue";
 export default {
   name: "EhsRescueTeam",
   dicts: ['team_property','team_level'],
   components: {
     importUpload,
+    realDetail,
     tdh,
   },
   data() {
@@ -334,6 +359,9 @@ export default {
       },
       // 表单参数
       form: {},
+      readParams: {},
+      // 队伍表详细数据
+      detailDataTeam: {},
       // 表单校验
       rules: {
         teamName: [
@@ -401,6 +429,24 @@ export default {
         this.loading = false;
       });
     },
+
+    /** 获取队伍和人员信息 */
+    getTeamInfoDetail(row) {
+      this.readParams = {
+        pageNum: 1,
+        pageSize: 10,
+        rescueTeamId: row.id,
+      };
+      // 获取队伍详情
+      getXq(row.id).then((res) => {
+        if (res.code == 200) {
+          this.detailDataTeam = res.data;
+          this.$refs.realDetailRef.open = true;
+        } else {
+          this.$message.warning(res.msg);
+        }
+      });
+    },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -451,7 +497,6 @@ export default {
       this.open = true;
       this.title = "添加应急救援队伍管理";
       if (this.curDeptId != 100){
-        console.log("hello:"+this.partDeptInfo[0]);
         this.form.unit = this.partDeptInfo[0].deptName;
       }
     },

ruoyi-ui/src/views/ehs/ehsRescueTeam/realDetail.vue

@@ -0,0 +1,67 @@
+<template>
+    <el-dialog
+      v-dialogDrag
+      :title="title"
+      :visible.sync="open"
+      width="800px"
+      append-to-body
+      v-if="open"
+    >
+
+
+    <el-tabs v-model="activeName"  type="border-card" @tab-click="handleClick">
+      <el-tab-pane label="基础信息" name="first">
+          <fisrt :detailData="detailData" :readParams="readParams"></fisrt>
+      </el-tab-pane>
+    </el-tabs>
+
+    </el-dialog>
+  </template>
+
+  <script>
+      import fisrt from "./tabs_first.vue"
+
+  export default {
+      components:{
+          fisrt,
+      },
+    data() {
+      return {
+        data:[],
+          activeName:"first",
+          size:"",
+        open: false,
+        form: {},
+        rules: [],
+      };
+    },
+    props: {
+      detailData:{
+        type:Object,
+      },
+      title: {
+        type: String,
+        default: "详情",
+      },
+      // readParams有3成员变量,pageNum,pageSize和teamId
+      readParams:{
+        type:Object
+      }
+    },
+    created(){
+    },
+    methods: {
+
+
+      handleClick(tab, event) {
+          console.log(tab, event);
+        },
+      submitForm() {
+        this.open = false;
+        this.$emit("ok");
+      },
+    },
+  };
+  </script>
+
+  <style></style>

ruoyi-ui/src/views/ehs/ehsRescueTeam/tabs_first.vue

@@ -0,0 +1,160 @@
+<template>
+  <div class="content">
+    <el-descriptions class="margin-top" title="队伍信息" :column="3" size="medium" border>
+
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-user-solid"></i>
+          队伍名称
+        </template>
+        {{ detailData.teamName }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-office-building"></i>
+          队伍级别
+        </template>
+        {{ detailData.teamLevel }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-office-building"></i>
+          所属单位
+        </template>
+        {{ detailData.unit }}
+      </el-descriptions-item>
+
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-user"></i>
+          负责人
+        </template>
+        {{ detailData.dutyer }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-mobile-phone"></i>
+          联系电话
+        </template>
+        {{ detailData.phone }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-s-home"></i>
+          驻地
+        </template>
+        {{ detailData.station }}
+      </el-descriptions-item>
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-office-building"></i>
+          队伍属性
+        </template>
+        <p v-if="detailData.teamProperty == 0">其他</p>
+        <p v-if="detailData.teamProperty == 1">政府</p>
+        <p v-if="detailData.teamProperty == 2">企业</p>
+        <p v-if="detailData.teamProperty == 3">社会</p>
+      </el-descriptions-item>
+
+
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-location-outline"></i>
+          救援人员数量
+        </template>
+        {{ detailData.rescueWorkerNum }}
+      </el-descriptions-item>
+
+      <el-descriptions-item>
+        <template slot="label">
+          <i class="el-icon-s-order"></i>
+          备注
+        </template>
+        {{ detailData.remark }}
+      </el-descriptions-item>
+    </el-descriptions>
+    <span style="font-size: 16px;font-weight: bold;display: block;">人员信息</span>
+
+    <el-table
+        v-loading="loading"
+        :data="workerList"
+        height="450"
+        border
+      >
+
+      <el-table-column label="序号" align="center" prop="" >
+        <template slot-scope="scope">
+          <span>{{scope.$index+1}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="队伍名称" align="center" prop="rescueTeamName" :show-overflow-tooltip="true"/>
+      <el-table-column label="人员姓名" align="center" prop="workerName" :show-overflow-tooltip="true"/>
+      <el-table-column label="年龄" align="center" prop="workerAge" :show-overflow-tooltip="true"/>
+      <el-table-column label="性别" align="center" prop="gender" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.gender"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="身份证号" align="center" prop="idCard" :show-overflow-tooltip="true"/>
+      <el-table-column label="联系方式" align="center" prop="phone" :show-overflow-tooltip="true"/>
+      <el-table-column label="队内职务" align="center" prop="teamPost" :show-overflow-tooltip="true"/>
+      <el-table-column label="工作年限" align="center" prop="workYear" :show-overflow-tooltip="true"/>
+      <el-table-column label="救援技能特长" align="center" prop="speciality" :show-overflow-tooltip="true"/>
+      <el-table-column label="培训次数" align="center" prop="trainNum" :show-overflow-tooltip="true"/>
+      <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true"/>
+
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="pageNum"
+      :limit.sync="pageSize"
+      @pagination="getList"
+    />
+
+
+  </div>
+</template>
+
+<script>
+import { getWorkerInfo } from '@/api/ehs/realdata'
+export default {
+  dicts: ['team_property','team_level','sys_user_sex'],
+  props: {
+    detailData: {
+      type: Object,
+    },
+    readParams: {
+      type: Object,
+    }
+  },
+  data(){
+    return{
+      workerList: [],
+      loading: false,
+      total: 0,
+      pageNum: 1,
+      pageSize: 10,
+    }
+
+  },
+  created() {
+    this.getList();
+  },
+  methods:{
+    async getList() {
+      this.loading = true;
+      await getWorkerInfo(this.readParams.rescueTeamId).then(res => {
+        this.total = res.total;
+        this.workerList = res.rows;
+        this.loading = false;
+      })
+    }
+  }
+};
+</script>
+
+<style>
+
+</style>