zc

src/api/commonality/noPermission.js

@@ -172,7 +172,7 @@ export function configInfo(data) {
   })
 }
 /*=================================V3=================================*/
-//查询人员下拉裂变
+//查询人员下拉列表
 export function systemUserSelectUser(data) {
   return request({
     url: '/system/user/selectUser',

src/api/commonality/permission.js

@@ -423,3 +423,12 @@ export function systemDeptList(data) {
   })
 }
 
+//查询职位(身份)-下拉列表
+export function systemPostSelect(query) {
+  return request({
+    url: '/system/post/select',
+    method: 'get',
+    params: query
+  })
+}
+

src/api/integratedManagement/index.js

@@ -433,3 +433,46 @@ export function laboratoryExitLineAdd(data) {
   })
 }
 
+//职位(身份)-列表
+export function systemPostList(query) {
+  return request({
+    url: '/system/post/list',
+    method: 'get',
+    params: query
+  })
+}
+
+//职位(身份)-详情
+export function systemPostDetail(query) {
+  return request({
+    url: '/system/post/detail',
+    method: 'get',
+    params: query
+  })
+}
+
+//职位(身份)-新增
+export function systemPostAdd(data) {
+  return request({
+    url: '/system/post/add',
+    method: 'post',
+    data: data
+  })
+}
+
+//职位(身份)-修改
+export function systemPostUpdate(data) {
+  return request({
+    url: '/system/post/update',
+    method: 'post',
+    data: data
+  })
+}
+//职位(身份)-删除
+export function systemPostDelete(data) {
+  return request({
+    url: '/system/post/delete',
+    method: 'post',
+    data: data
+  })
+}

src/components/fullScreenMpegtsVideo/fullScreenMpegtsVideo.vue

@@ -217,13 +217,13 @@
   }
   .out-position-p{
     position: absolute;
-    top:50px;
-    right:50px;
-    font-size:40px;
+    top:20px;
+    right:20px;
+    font-size:30px;
     color:#fff;
-    width:40px;
-    height:40px;
-    line-height:40px;
+    width:30px;
+    height:30px;
+    line-height:30px;
     cursor: pointer;
   }
   .fullScreenMpegtsVideo{

src/views/chemicalManage/basicManagement/chemicalInfo/index.vue

@@ -86,7 +86,7 @@
         <div class="selected-num-box" v-show="total>0">
           <p class="selected-num-p">
             <i class="el-icon-warning"></i>
-            已选择 {{queryParams.selectedNum}} 项
+            已选择 {{selectedNum}} 项
           </p>
           <pagination :page-sizes="[20, 30, 40, 50]"
                       :total="total"
@@ -145,13 +145,13 @@
         optionListB:[{value:true,label:'启用'},{value:false,label:'停用'}],
         //查询条件
         queryParams:{
-          selectedNum:0,
           page:1,
           pageSize:20,
           queryParamsData1:"",
           queryParamsData2 :null,
           queryParamsData3 :null,
         },
+        selectedNum:0,
         //列表数据
         dataList:[
           {id:'s1',name:'name1'},{id:'a2',name:'name2'},{id:'b3',name:'name3'},
@@ -177,8 +177,8 @@
       },
       //重置按钮
       resetQuery(){
+        this.$set(this,'selectedNum',0);
         this.$set(this,'queryParams',{
-          selectedNum:0,
           page:1,
           pageSize:20,
           queryParamsData1:"",

src/views/chemicalManage/inventoryManagement/inventoryStatistics/collectList.vue

@@ -0,0 +1,328 @@
+<!-- 汇总统计 -->
+<template>
+  <div class="collectList">
+    <div class="page-container collectListPage" v-if="pageType === 1">
+      <div class="title-max-button-box">
+        <div @click="titleClick">
+          <p>库存明细</p>
+          <p></p>
+        </div>
+        <div class="check-box">
+          <p>汇总统计</p>
+          <p></p>
+        </div>
+      </div>
+      <div class="page-form-title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm"
+                 :inline="true" style="width:100%;">
+          <el-form-item label="" prop="queryParamsData2">
+            <el-select v-model="queryParams.queryParamsData2" placeholder="请选择学院" style="width: 160px">
+              <el-option
+                v-for="item in deptOptions"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData3">
+            <el-cascader
+              style="width: 180px"
+              placeholder="请选择楼栋楼层"
+              :props="{value: 'id', label: 'name',children:'buildFloorVoList'}"
+              v-model="queryParams.queryParamsData3"
+              :options="buildFloorOptions">
+            </el-cascader>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData4">
+            <el-select v-model="queryParams.queryParamsData4" placeholder="请选择级别" style="width: 140px">
+              <el-option
+                v-for="dict in optionList"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData5">
+            <el-select v-model="queryParams.queryParamsData5" placeholder="请选择类别" style="width: 140px">
+              <el-option
+                v-for="dict in optionList"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData1">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.queryParamsData1"
+              placeholder="化学品名/CAS/编码/实验室/房间号/姓名/联系方式"
+              style="width: 340px"
+            />
+          </el-form-item>
+          <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
+          <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
+          <el-form-item style="float: right;">
+            <export-component :exportConfig="exportConfig" v-hasPermiRouter="['demo:demo:demo']"></export-component>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="page-content-box">
+        <el-table class="table-box" v-loading="loading" border :data="dataList"
+                  @selection-change="handleSelectionChange" :row-key="getRowKeys">
+          <el-table-column type="selection" width="50" align="center" fixed="" :reserve-selection="true"/>
+          <el-table-column label="名称" prop="name" width="200" fixed="" show-overflow-tooltip/>
+          <el-table-column label="CAS" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="类别" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="级别" prop="content" width="120" show-overflow-tooltip/>
+          <el-table-column label="学院" prop="content" width="120" show-overflow-tooltip/>
+          <el-table-column label="楼栋楼层" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="实验室" prop="content" width="250" show-overflow-tooltip/>
+          <el-table-column label="实验室负责人" prop="content" width="170" show-overflow-tooltip/>
+          <el-table-column label="安全员" prop="content" width="170" show-overflow-tooltip/>
+          <el-table-column label="库存量" prop="content" width="130" show-overflow-tooltip/>
+          <el-table-column label="数量" prop="content" width="100" show-overflow-tooltip/>
+          <el-table-column label="操作" width="150" show-overflow-tooltip v-if="tableButtonType">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p"
+                   @click="tableButton(2,scope.row)"
+                   v-hasPermiRouter="['demo:demo:detail']"
+                >详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="selected-num-box" v-show="total>0">
+          <p class="selected-num-p">
+            <i class="el-icon-warning"></i>
+            已选择 {{selectedNum}} 项
+          </p>
+          <pagination :page-sizes="[20, 30, 40, 50]"
+                      :total="total"
+                      :page.sync="queryParams.page"
+                      :limit.sync="queryParams.pageSize"
+                      @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+    <list-page :propsData="propsData" v-if="pageType === 2"></list-page>
+  </div>
+</template>
+<script>
+  //import { getDicts } from "@/api/commonality/noPermission";
+  //import { systemUserSelect } from "@/api/commonality/permission";
+  //import { getInfo } from "@/api/basicsModules/index";
+  //import addPage from "./addPage.vue";
+  import listPage from "./listPage.vue"
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+  import { getDeptDropList,systemBuildingGetTreeList,} from "@/api/commonality/permission";
+  export default {
+    name: 'collectList',
+    components: {
+      exportComponent,
+      listPage
+    },
+    data () {
+      return {
+        titleType:1,
+        //导出配置
+        exportConfig:{
+          api:'system/user/student/export',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'化学品信息',                         //导出文件的命名
+        },
+        tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
+        //页面状态
+        pageType:2,
+        //页面遮罩
+        loading:false,
+        //学院
+        deptOptions:[],
+        //楼栋楼层
+        buildFloorOptions:[],
+        //下拉列表数据
+        optionList:[{value:true,label:'启用'},{value:false,label:'停用'}],
+        //查询条件
+        queryParams:{
+          page:1,
+          pageSize:20,
+          queryParamsData1:"",
+          queryParamsData2 :null,
+        },
+        //列表数据
+        dataList:[{},{},{},{},],
+        //数据数量
+        total:10,
+        // 选中数组
+        selectedNum:0,
+        ids:[],
+        multiple:true,
+        //组件传参
+        propsData:{},
+      }
+    },
+    created () {
+
+    },
+    mounted () {
+      this.getDeptDropList();
+      this.systemBuildingGetTreeList();
+      this.getList();
+    },
+    methods: {
+      titleClick(){
+        this.$parent.titleTypeButton(1);
+      },
+      //查询按钮
+      handleQuery(){
+        this.$set(this.queryParams,'page',1);
+        this.getList();
+      },
+      //重置按钮
+      resetQuery(){
+        this.$set(this,'dateRange',[])
+        this.$set(this,'queryParams',{
+          page:1,
+          pageSize:20,
+          queryParamsData1:"",
+          queryParamsData2 :null,
+        });
+        this.getList();
+      },
+      //获取数据列表
+      getList(){
+        // this.$set(this,'loading',true);
+        // getListFunction(this.queryParams).then(response => {
+        //   this.$set(this,'loading',false);
+        //   this.$set(this,'dataList',response.data.records);
+        //   this.$set(this,'total',response.data.total);
+        // });
+      },
+      //操作按钮
+      tableButton(type,row){
+        if(type == 2){
+          //详情
+          let obj = JSON.parse(JSON.stringify(row))
+          this.$set(this,'propsData',obj);
+          this.$set(this,'pageType',2);
+        }else if(type == 1){
+          //返回并刷新
+          this.$set(this,'pageType',1);
+          this.$set(this,'propsData',{});
+          this.getList();
+        }
+      },
+      //查询学院列表
+      getDeptDropList(){
+        getDeptDropList({deptName:"",level:2,deptType:1}).then(response => {
+          this.$set(this, 'deptOptions', response.data)
+        });
+      },
+      //查询楼栋楼层
+      systemBuildingGetTreeList(){
+        systemBuildingGetTreeList({}).then(response => {
+          if (response.data[0]) {
+            let list = this.forBuildFloor(response.data);
+            let newList = [];
+            for(let i=0;i<list.length;i++){
+              if(list[i].buildFloorVoList){
+                for(let o=0;o<list[i].buildFloorVoList.length;o++){
+                  if(list[i].buildFloorVoList[o].buildFloorVoList){
+                    newList.push(list[i].buildFloorVoList[o])
+                  }
+                }
+              }
+            }
+            console.log('newList========>',newList);
+            this.$set(this, 'buildFloorOptions', newList)
+          }
+        })
+      },
+      //处理楼栋楼层数据
+      forBuildFloor(list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(list[i].buildFloorVoList){
+            if(list[i].buildFloorVoList[0]){
+              list[i].buildFloorVoList = self.forBuildFloor(list[i].buildFloorVoList);
+            }else{
+              delete list[i].buildFloorVoList;
+            }
+          }else{
+            delete list[i].buildFloorVoList;
+          }
+        }
+        return list
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      //多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.ids = selection.map(item => item.id)
+        this.multiple = !selection.length
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+  .collectList{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    .collectListPage{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      .title-max-button-box{
+        height:80px;
+        display: flex;
+        border-bottom:1px solid #dedede;
+        div{
+          cursor: pointer;
+          margin-left:30px;
+          p:nth-child(1){
+            width:80px;
+            line-height: 52px;
+            text-align: center;
+            font-size:16px;
+            margin-top:12px;
+          }
+          p:nth-child(2){
+            width:60px;
+            height:4px;
+            border-radius:2px;
+            margin-left:10px;
+          }
+        }
+        .check-box{
+          p:nth-child(1){
+            color:#0045AF;
+          }
+          p:nth-child(2){
+            background-color:#0045AF;
+          }
+        }
+      }
+      .page-form-title-box{
+        border-bottom:none;
+      }
+      .page-content-box{
+        padding-top:0;
+      }
+    }
+  }
+</style>

src/views/chemicalManage/inventoryManagement/inventoryStatistics/index.vue

@@ -0,0 +1,80 @@
+<!-- 库存统计 -->
+<template>
+  <div class="app-container inventoryStatistics">
+    <div class="inventoryStatisticsPage">
+      <inventory-list v-if="titleType == 1"></inventory-list>
+      <collect-list v-if="titleType == 2"></collect-list>
+    </div>
+  </div>
+</template>
+<script>
+  //import { getDicts } from "@/api/commonality/noPermission";
+  //import { systemUserSelect } from "@/api/commonality/permission";
+  //import { getInfo } from "@/api/basicsModules/index";
+  import collectList from "./collectList.vue";
+  import inventoryList from "./inventoryList.vue";
+  export default {
+    name: 'index',
+    components: {
+      collectList,
+      inventoryList,
+    },
+    data () {
+      return {
+        titleType:2,
+      }
+    },
+    created () {
+
+    },
+    mounted () {
+
+    },
+    methods: {
+      //切换
+      titleTypeButton(type){
+        this.$set(this,'titleType',type);
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+  .inventoryStatistics{
+    .title-max-button-box{
+      height:80px;
+      display: flex;
+      border-bottom:1px solid #dedede;
+      div{
+        cursor: pointer;
+        margin-left:30px;
+        p:nth-child(1){
+          width:80px;
+          line-height: 52px;
+          text-align: center;
+          font-size:16px;
+          margin-top:12px;
+        }
+        p:nth-child(2){
+          width:60px;
+          height:4px;
+          border-radius:2px;
+          margin-left:10px;
+        }
+      }
+      .check-box{
+        p:nth-child(1){
+          color:#0045AF;
+        }
+        p:nth-child(2){
+          background-color:#0045AF;
+        }
+      }
+    }
+    .inventoryStatisticsPage{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+    }
+  }
+</style>

src/views/chemicalManage/inventoryManagement/inventoryStatistics/infoPage.vue

@@ -0,0 +1,382 @@
+<template>
+  <div class="page-container infoPage">
+    <div class="page-top-title-box">
+      <p class="page-top-title-name-p">详情</p>
+      <p class="page-top-title-out-p" @click="backPage">返回</p>
+    </div>
+    <div class="content-box">
+        <div class="content-box-left scrollbar-box">
+            <li class="chemical-name">{{newData.data1}}<p class="chemical-state">{{newData.data2}}</p></li>
+            <li>{{newData.data3}}</li>
+            <li>类别：{{newData.data4}}<p class="control-state">{{newData.data5}}</p></li>
+            <li>编码：{{newData.data6}}</li>
+            <li>RFID标签：{{newData.data7}}</li>
+            <li>规格：{{newData.data8}}</li>
+            <li>实时库存：{{newData.data9}}</li>
+            <li>过期时间：{{newData.data10}} | {{newData.data11}}天前提醒</li>
+            <li>领用时效：{{newData.data12}}小时</li>
+            <li>实验室：{{newData.data13}}</li>
+            <li>安全员：{{newData.data14}}</li>
+            <li>位置：{{newData.data15}}</li>
+            <li>归属人：{{newData.data16}}</li>
+        </div>
+        <div class="lines"></div>
+        <div class="content-box-right scrollbar-box">
+            <div class="record" v-for="(item,index) in newData.dataList">
+              <div class="record-li">
+                  <div class="record-li-t">
+                      <div class="record-li-t-l">{{item.itemData1}}</div>
+                      <div class="record-li-t-r">
+                        <p v-if="item.itemData2" @click="lookVideo(item.videoA)">操作视频</p>
+                        <p v-if="item.itemData3" @click="lookVideo(item.videoB)">开门视频</p>
+                      </div>
+                  </div>
+                  <div class="record-li-m">
+                    <p>操作时间</p>
+                    <p>领用量</p>
+                    <p>使用量</p>
+                    <p>是否整瓶领用</p>
+                    <p>称重方式</p>
+                    <p>双人认证</p>
+                    <p>操作人</p>
+                  </div>
+                  <div class="record-li-b">
+                      <p>{{item.itemData4}}</p>
+                      <p>{{item.itemData5}}</p>
+                      <p>{{item.itemData6}}</p>
+                      <p>{{item.itemData7}}</p>
+                      <p>{{item.itemData8}}</p>
+                      <p>{{item.itemData9}}</p>
+                      <p>{{item.itemData10}}</p>
+                    </div>
+              </div>
+              <div class="record-li">
+                <div class="record-li-t">
+                  <div class="record-li-t-l">{{item.itemData11}}</div>
+                  <div class="record-li-t-r">
+                    <p v-if="item.itemData12" @click="lookVideo(item.videoC)">操作视频</p>
+                    <p v-if="item.itemData12" @click="lookVideo(item.videoD)">开门视频</p>
+                  </div>
+                </div>
+                <div class="record-li-m">
+                  <p>操作时间</p>
+                  <p>领用量</p>
+                  <p>使用量</p>
+                  <p>是否整瓶领用</p>
+                  <p>称重方式</p>
+                  <p>双人认证</p>
+                  <p>操作人</p>
+                </div>
+                <div class="record-li-b">
+                  <p>{{item.itemData14}}</p>
+                  <p>{{item.itemData15}}</p>
+                  <p>{{item.itemData16}}</p>
+                  <p>{{item.itemData17}}</p>
+                  <p>{{item.itemData18}}</p>
+                  <p>{{item.itemData19}}</p>
+                  <p>{{item.itemData20}}</p>
+                </div>
+              </div>
+            </div>
+        </div>
+    </div>
+
+    <full-screen-mpegts-video ref="fullScreenMpegtsVideo" :videoProps="videoProps"></full-screen-mpegts-video>
+  </div>
+</template>
+
+<script>
+  import fullScreenMpegtsVideo from '@/components/fullScreenMpegtsVideo/fullScreenMpegtsVideo.vue'
+  export default {
+    name: 'infoPage',
+    components: {
+      fullScreenMpegtsVideo,
+    },
+    props:{
+      propsData:{},
+    },
+    data(){
+      return{
+        //视频配置
+        videoProps:{
+          id:50,        //(ID:非必传-默认随机生成)
+          type:'mp4',   //(视频类型:非必传-默认'flv')
+          isLive:true,  //(是否直播流:非必传-默认true)
+          url:""        //(视频地址:必传)
+        },
+        videoType:false,
+        //数据
+        newData:{
+          data1:'化学品名称',
+          data2:'已出库',
+          data3:'形态/纯度/CAS12-34-56',
+          data4:'易制毒',
+          data5:'管控',
+          data6:'123456789',
+          data7:'123456789',
+          data8:'500ml/瓶',
+          data9:'500ml',
+          data10:'2023-10-29',
+          data11:'30',
+          data12:'1',
+          data13:'实验室名称（房间号）',
+          data14:'曹秀康-13227872222',
+          data15:'化学品柜-柜门-层',
+          data16:'李砖头',
+          dataList:[
+            {
+              itemData1:'空瓶出库',
+              itemData2:false,
+              itemData3:false,
+              itemData4:'2023/09/15 16:39',
+              itemData5:'400ml',
+              itemData6:'400ml',
+              itemData7:'是',
+              itemData8:'手工录入',
+              itemData9:'张漂亮、李砖头',
+              itemData10:'李砖头',
+              itemData11:'空瓶出库',
+              itemData12:true,
+              itemData13:true,
+              itemData14:'2023/09/15 16:39',
+              itemData15:'400ml',
+              itemData16:'400ml',
+              itemData17:'是',
+              itemData18:'手工录入',
+              itemData19:'张漂亮、李砖头',
+              itemData20:'李砖头',
+              videoA:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoB:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoC:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoD:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+            },
+            {
+              itemData1:'空瓶出库',
+              itemData2:false,
+              itemData3:false,
+              itemData4:'2023/09/15 16:39',
+              itemData5:'400ml',
+              itemData6:'400ml',
+              itemData7:'是',
+              itemData8:'手工录入',
+              itemData9:'张漂亮、李砖头',
+              itemData10:'李砖头',
+              itemData11:'空瓶出库',
+              itemData12:true,
+              itemData13:true,
+              itemData14:'2023/09/15 16:39',
+              itemData15:'400ml',
+              itemData16:'400ml',
+              itemData17:'是',
+              itemData18:'手工录入',
+              itemData19:'张漂亮、李砖头',
+              itemData20:'李砖头',
+              videoA:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoB:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoC:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoD:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+            },
+            {
+              itemData1:'空瓶出库',
+              itemData2:false,
+              itemData3:false,
+              itemData4:'2023/09/15 16:39',
+              itemData5:'400ml',
+              itemData6:'400ml',
+              itemData7:'是',
+              itemData8:'手工录入',
+              itemData9:'张漂亮、李砖头',
+              itemData10:'李砖头',
+              itemData11:'空瓶出库',
+              itemData12:true,
+              itemData13:true,
+              itemData14:'2023/09/15 16:39',
+              itemData15:'400ml',
+              itemData16:'400ml',
+              itemData17:'是',
+              itemData18:'手工录入',
+              itemData19:'张漂亮、李砖头',
+              itemData20:'李砖头',
+              videoA:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoB:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoC:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+              videoD:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
+            },
+          ],
+        },
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+
+    },
+    methods:{
+      // 返回按钮
+      backPage(){
+        this.$parent.tableButton('1');
+      },
+      //浏览视频
+      lookVideo(url){
+        console.log('url======>',url);
+        this.$set(this.videoProps,'url',url);
+        this.$refs.fullScreenMpegtsVideo.openVideo()
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .infoPage{
+    .content-box{
+      flex:1;
+      display: flex;
+      padding:20px;
+      overflow: hidden;
+      .content-box-left{
+        width: 412px;
+        padding: 10px 28px 0 60px;
+        box-sizing: border-box;
+        >li{
+          list-style-type: none;
+          font-size: 16px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #333333;
+          margin-bottom: 20px;
+          display: flex;
+        }
+        .chemical-name{
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          .chemical-state{
+            width: 80px;
+            height: 30px;
+            background: #0183FA;
+            border-radius: 6px 6px 6px 6px;
+            font-size: 16px;
+            font-family: Microsoft YaHei, Microsoft YaHei;
+            font-weight: 400;
+            color: #FFFFFF;
+            line-height: 30px;
+            text-align: center;
+          }
+        }
+
+        .control-state{
+          width: 50px;
+          height: 24px;
+          border-radius: 4px 4px 4px 4px;
+          opacity: 1;
+          border: 1px solid #FC7F1A;
+          font-size: 12px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #FC7F1A;
+          line-height: 22px;
+          text-align: center;
+          margin-left:10px;
+          float: right;
+        }
+      }
+      .lines{
+        width:1px ;
+        height: 760px;
+        opacity: 1;
+        border: 1px dashed #D8D8D8;
+      }
+      .content-box-right{
+        flex:1;
+        margin-left:56px ;
+        padding-top:10px;
+        .record:nth-child(1){
+          padding-top:0;
+          border-top:none;
+        }
+        .record{
+          width: 1028px;
+          height:auto;
+          opacity: 1;
+          border-top: 1px dashed #D8D8D8;
+          margin:0 0 10px;
+          overflow: hidden;
+          padding-top:30px;
+          .record-li{
+            margin-bottom: 20px;
+            .record-li-t{
+              display: flex;
+              justify-content: space-between;
+              .record-li-t-l{
+                width: 150px;
+                height: 40px;
+                background: #0183FA;
+                border-radius: 8px 8px 0px 0px;
+                font-size: 16px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                font-weight: 400;
+                color: #FFFFFF;
+                line-height: 40px;
+                text-align: center;
+              }
+              .record-li-t-r{
+                display: flex;
+                >p{
+                  width: 100px;
+                  height: 30px;
+                  border-radius: 6px 6px 6px 6px;
+                  opacity: 1;
+                  border: 1px solid #0183FA;
+                  font-size: 16px;
+                  font-family: Microsoft YaHei, Microsoft YaHei;
+                  font-weight: 400;
+                  color: #0183FA;
+                  line-height: 28px;
+                  text-align: center;
+                  margin-left:10px;
+                  cursor: pointer;
+                }
+              }
+            }
+            .record-li-m{
+              display: flex;
+              justify-content: flex-start;
+              border: 1px solid #E0E0E0;
+              >p{
+                font-weight:700;
+                flex: 1;
+                height: 40px;
+                background: #F5F5F5;
+                font-size: 16px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                color: #333333;
+                line-height: 40px;
+                text-align: center;
+                border-right: 1px solid #E0E0E0;
+              }
+            }
+            .record-li-b{
+              display: flex;
+              justify-content: flex-start;
+              border-bottom: 1px solid #E0E0E0;
+              border-left: 1px solid #E0E0E0;
+              border-right: 1px solid #E0E0E0;
+              >p{
+                flex: 1;
+                height: 40px;
+                font-size: 14px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+                line-height: 40px;
+                text-align: center;
+                border-right: 1px solid #E0E0E0;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/chemicalManage/inventoryManagement/inventoryStatistics/inventoryList.vue

@@ -0,0 +1,341 @@
+<!-- 库存明细 -->
+<template>
+  <div class="inventoryList">
+    <div class="page-container inventoryListPage" v-if="pageType === 1">
+      <div class="title-max-button-box">
+        <div class="check-box">
+          <p>库存明细</p>
+          <p></p>
+        </div>
+        <div @click="titleClick">
+          <p>汇总统计</p>
+          <p></p>
+        </div>
+      </div>
+      <div class="page-form-title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm"
+                 :inline="true" style="width:100%;">
+          <el-form-item label="" prop="queryParamsData2">
+            <el-select v-model="queryParams.queryParamsData2" placeholder="请选择学院" style="width: 160px">
+              <el-option
+                v-for="item in deptOptions"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData3">
+            <el-cascader
+              style="width: 180px"
+              placeholder="请选择楼栋楼层"
+              :props="{value: 'id', label: 'name',children:'buildFloorVoList'}"
+              v-model="queryParams.queryParamsData3"
+              :options="buildFloorOptions">
+            </el-cascader>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData4">
+            <el-select v-model="queryParams.queryParamsData4" placeholder="请选择级别" style="width: 140px">
+              <el-option
+                v-for="dict in optionList"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData5">
+            <el-select v-model="queryParams.queryParamsData5" placeholder="请选择类别" style="width: 140px">
+              <el-option
+                v-for="dict in optionList"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData6">
+            <el-select v-model="queryParams.queryParamsData6" placeholder="请选择状态" style="width: 140px">
+              <el-option
+                v-for="dict in optionList"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData1">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.queryParamsData1"
+              placeholder="化学品名/CAS/编码/实验室/房间号/姓名/联系方式"
+              style="width: 340px"
+            />
+          </el-form-item>
+          <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
+          <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
+          <el-form-item style="float: right;">
+            <export-component :exportConfig="exportConfig" v-hasPermiRouter="['demo:demo:demo']"></export-component>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="page-content-box">
+        <el-table class="table-box" v-loading="loading" border :data="dataList"
+                  @selection-change="handleSelectionChange" :row-key="getRowKeys">
+          <el-table-column type="selection" width="50" align="center" fixed="" :reserve-selection="true"/>
+          <el-table-column label="名称" prop="name" width="200" fixed="" show-overflow-tooltip/>
+          <el-table-column label="编码" prop="content" width="120" show-overflow-tooltip/>
+          <el-table-column label="类别" prop="content" width="120" show-overflow-tooltip/>
+          <el-table-column label="级别" prop="content" width="120" show-overflow-tooltip/>
+          <el-table-column label="学院" prop="content" width="120" show-overflow-tooltip/>
+          <el-table-column label="楼栋楼层" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="实验室" prop="content" width="230" show-overflow-tooltip/>
+          <el-table-column label="实验室负责人" prop="content" width="170" show-overflow-tooltip/>
+          <el-table-column label="安全员" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="存储位置" prop="content" width="250" show-overflow-tooltip/>
+          <el-table-column label="规格" prop="content" width="100" show-overflow-tooltip/>
+          <el-table-column label="归属人" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="库存余量" prop="content" width="100" show-overflow-tooltip/>
+          <el-table-column label="状态" prop="content" width="100" show-overflow-tooltip/>
+          <el-table-column label="操作" width="100" show-overflow-tooltip v-if="tableButtonType">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p"
+                   @click="tableButton(2,scope.row)"
+                   v-hasPermiRouter="['demo:demo:detail']"
+                >详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="selected-num-box" v-show="total>0">
+          <p class="selected-num-p">
+            <i class="el-icon-warning"></i>
+            已选择 {{selectedNum}} 项
+          </p>
+          <pagination :page-sizes="[20, 30, 40, 50]"
+                      :total="total"
+                      :page.sync="queryParams.page"
+                      :limit.sync="queryParams.pageSize"
+                      @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+    <infoPage v-if="pageType == 2" :propsData="propsData"></infoPage>
+    <!--<add-page :propsData="propsData" v-if="pageType === 2"></add-page>-->
+  </div>
+</template>
+<script>
+  //import { getDicts } from "@/api/commonality/noPermission";
+  //import { systemUserSelect } from "@/api/commonality/permission";
+  //import { getInfo } from "@/api/basicsModules/index";
+  //import addPage from "./addPage.vue";
+  import infoPage from "./infoPage.vue"
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+  import { getDeptDropList,systemBuildingGetTreeList,} from "@/api/commonality/permission";
+  export default {
+    name: 'inventoryList',
+    components: {
+      exportComponent,
+      infoPage,
+    },
+    data () {
+      return {
+        titleType:1,
+        //导出配置
+        exportConfig:{
+          api:'system/user/student/export',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'化学品信息',                         //导出文件的命名
+        },
+        tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
+        //页面状态
+        pageType:1,
+        //页面遮罩
+        loading:false,
+        //学院
+        deptOptions:[],
+        //楼栋楼层
+        buildFloorOptions:[],
+        //下拉列表数据
+        optionList:[{value:true,label:'启用'},{value:false,label:'停用'}],
+        //查询条件
+        queryParams:{
+          page:1,
+          pageSize:20,
+          queryParamsData1:"",
+          queryParamsData2 :null,
+        },
+        //列表数据
+        dataList:[{},{},{},{},],
+        //数据数量
+        total:10,
+        // 选中数组
+        selectedNum:0,
+        ids:[],
+        multiple:true,
+        //组件传参
+        propsData:{},
+      }
+    },
+    created () {
+
+    },
+    mounted () {
+      this.getDeptDropList();
+      this.systemBuildingGetTreeList();
+      this.getList();
+    },
+    methods: {
+      titleClick(){
+        this.$parent.titleTypeButton(2);
+      },
+      //查询按钮
+      handleQuery(){
+        this.$set(this.queryParams,'page',1);
+        this.getList();
+      },
+      //重置按钮
+      resetQuery(){
+        this.$set(this,'dateRange',[])
+        this.$set(this,'queryParams',{
+          page:1,
+          pageSize:20,
+          queryParamsData1:"",
+          queryParamsData2 :null,
+        });
+        this.getList();
+      },
+      //获取数据列表
+      getList(){
+        // this.$set(this,'loading',true);
+        // getListFunction(this.queryParams).then(response => {
+        //   this.$set(this,'loading',false);
+        //   this.$set(this,'dataList',response.data.records);
+        //   this.$set(this,'total',response.data.total);
+        // });
+      },
+      //操作按钮
+      tableButton(type,row){
+        if(type == 2){
+          //详情
+          let obj = JSON.parse(JSON.stringify(row))
+          this.$set(this,'propsData',obj);
+          this.$set(this,'pageType',2);
+        }else if(type == 1){
+          //返回并刷新
+          this.$set(this,'pageType',1);
+          this.getList();
+        }
+      },
+      //查询学院列表
+      getDeptDropList(){
+        getDeptDropList({deptName:"",level:2,deptType:1}).then(response => {
+          this.$set(this, 'deptOptions', response.data)
+        });
+      },
+      //查询楼栋楼层
+      systemBuildingGetTreeList(){
+        systemBuildingGetTreeList({}).then(response => {
+          if (response.data[0]) {
+            let list = this.forBuildFloor(response.data);
+            let newList = [];
+            for(let i=0;i<list.length;i++){
+              if(list[i].buildFloorVoList){
+                for(let o=0;o<list[i].buildFloorVoList.length;o++){
+                  if(list[i].buildFloorVoList[o].buildFloorVoList){
+                    newList.push(list[i].buildFloorVoList[o])
+                  }
+                }
+              }
+            }
+            console.log('newList========>',newList);
+            this.$set(this, 'buildFloorOptions', newList)
+          }
+        })
+      },
+      //处理楼栋楼层数据
+      forBuildFloor(list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(list[i].buildFloorVoList){
+            if(list[i].buildFloorVoList[0]){
+              list[i].buildFloorVoList = self.forBuildFloor(list[i].buildFloorVoList);
+            }else{
+              delete list[i].buildFloorVoList;
+            }
+          }else{
+            delete list[i].buildFloorVoList;
+          }
+        }
+        return list
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      //多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.ids = selection.map(item => item.id)
+        this.multiple = !selection.length
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+  .inventoryList{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    .inventoryListPage{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      .title-max-button-box{
+        height:80px;
+        display: flex;
+        border-bottom:1px solid #dedede;
+        div{
+          cursor: pointer;
+          margin-left:30px;
+          p:nth-child(1){
+            width:80px;
+            line-height: 52px;
+            text-align: center;
+            font-size:16px;
+            margin-top:12px;
+          }
+          p:nth-child(2){
+            width:60px;
+            height:4px;
+            border-radius:2px;
+            margin-left:10px;
+          }
+        }
+        .check-box{
+          p:nth-child(1){
+            color:#0045AF;
+          }
+          p:nth-child(2){
+            background-color:#0045AF;
+          }
+        }
+      }
+      .page-form-title-box{
+        border-bottom:none;
+      }
+      .page-content-box{
+        padding-top:0;
+      }
+    }
+  }
+</style>

src/views/chemicalManage/inventoryManagement/inventoryStatistics/listPage.vue

@@ -0,0 +1,271 @@
+<!--库存统计列表-->
+<template>
+  <div class="page-container inventoryStatistics-listPage">
+    <div class="page-top-title-box">
+      <p class="page-top-title-name-p">{{newData.name}} 丨 {{newData.address}}</p>
+      <p class="page-top-title-num-p">总数：{{newData.maxNum}}</p>
+      <p class="page-top-title-num-p">总量：{{newData.maxNum}}ml</p>
+      <p class="page-top-title-out-p" @click="backPage">返回</p>
+    </div>
+    <div class="content-box">
+      <div class="page-form-title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm"
+                 :inline="true" style="width:100%;">
+          <el-form-item label="" prop="queryParamsData3">
+            <el-select v-model="queryParams.queryParamsData2"
+                       placeholder="请选择化学品柜" style="width: 180px">
+              <el-option
+                v-for="item in categoryOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData2">
+            <el-select v-model="queryParams.queryParamsData2"
+                       placeholder="请选择状态" style="width: 140px">
+              <el-option
+                v-for="item in statusOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="state">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 260px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="过期开始时间"
+              end-placeholder="过期结束时间"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item label="" prop="queryParamsData1">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.queryParamsData1"
+              placeholder="化学品名/CAS/编码/归属人/课题组"
+              clearable
+              style="width: 220px"
+            />
+          </el-form-item>
+          <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
+          <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
+        </el-form>
+      </div>
+      <p class="num-min-box"></p>
+      <div class="page-content-box">
+        <el-table class="table-box" border :data="dataList">
+          <el-table-column label="编号" prop="name" show-overflow-tooltip/>
+          <el-table-column label="规格" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="储存位置" prop="content" width="300" show-overflow-tooltip/>
+          <el-table-column label="归属人" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="库存余量" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="过期时间" prop="content" width="240" show-overflow-tooltip/>
+          <el-table-column label="状态" prop="content" width="150" show-overflow-tooltip/>
+          <el-table-column label="操作" width="150" show-overflow-tooltip>
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p"
+                   @click="tableButton(2,scope.row)"
+                   v-hasPermiRouter="['demo:demo:detail']"
+                >详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.page"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  //import { getDicts } from "@/api/commonality/noPermission";
+  //import { systemUserSelect } from "@/api/commonality/permission";
+  //import { getInfo } from "@/api/basicsModules/index";
+  export default {
+    name: 'listPage',
+    props:{
+      propsData:{},
+    },
+    data(){
+      return{
+        showType:false,
+        //状态
+        statusOptions:[],
+        //类别
+        categoryOptions:[],
+        //级别
+        levelOptions:[],
+        dateRange:[],
+        //查询条件
+        queryParams:{
+          page:1,
+          pageSize:20,
+          queryParamsData1:"",
+          queryParamsData2 :null,
+          queryParamsData3 :null,
+        },
+        //列表数据
+        dataList:[
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+          {name:"1"},
+        ],
+        //数据数量
+        total:10,
+        tableCheck:'1',
+        newData:{
+          name:"化学品柜名称",
+          address:"所在位置地点",
+          maxNum:9999,
+        },
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+
+    },
+    methods:{
+      //操作按钮
+      tableButton(type,row){
+        if(type == 2){
+          //详情
+          let obj = JSON.parse(JSON.stringify(row))
+          this.$set(this,'propsData',obj);
+          this.$set(this,'pageType',2);
+        }else if(type == 1){
+          //返回并刷新
+          this.$set(this,'pageType',1);
+          this.$set(this,'propsData',{});
+          this.getList();
+        }
+      },
+      // 返回按钮
+      backPage(){
+        this.$parent.tableButton(1);
+      },
+      //查询按钮
+      handleQuery(){
+        this.$set(this.queryParams,'page',1);
+        this.getList();
+      },
+      //重置按钮
+      resetQuery(){
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          page:1,
+          pageSize:20,
+          queryParamsData1:"",
+          queryParamsData2 :null,
+          queryParamsData3 :null,
+        });
+        this.getList();
+      },
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.startTime = this.dateRange[0]+'T00:00:00'
+          obj.endTime = this.dateRange[1]+'T23:59:59'
+        }else{
+          obj.startTime = "";
+          obj.endTime = "";
+        }
+        getListFunction(obj).then(response => {
+          this.$set(this,'dataList',response.data.records);
+          this.$set(this,'total',response.data.total);
+        });
+      },
+      /** 提交按钮 */
+      submitForm() {
+        this.$refs["form"].validate(valid => {
+          if (valid) {
+
+          }
+        })
+      }
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .inventoryStatistics-listPage{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    .page-top-title-num-p{
+      line-height:40px;
+      margin-right:40px;
+    }
+    .content-box{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      padding:0 20px 20px 20px;
+      overflow: hidden;
+      .table-max-box{
+        p{
+          cursor: pointer;
+          display: inline-block;
+          text-align: center;
+          padding:0 20px;
+          color:#333;
+          border:1px solid #E0E0E0;
+          border-radius:4px;
+          line-height:40px;
+          margin-right:10px;
+        }
+        .tableCheck{
+          color:#fff;
+          background-color: #0183FA;
+          border:1px solid #0183FA;
+        }
+      }
+      .page-form-title-box{
+        border:none;
+      }
+      .num-min-box{
+        background-color:rgba(1,131,250,0.2);
+        color:#0183FA;
+        font-size:14px;
+        line-height:40px;
+        padding:0 20px;
+      }
+      .page-content-box{
+        padding:0;
+      }
+    }
+  }
+</style>

src/views/chemicalManage/useLedger/index.vue

@@ -163,7 +163,6 @@
     components: {
       exportComponent,
       infoPage,
-
     },
     data(){
       return{

src/views/integratedManagement/personnelManage/post/authUser.vue

@@ -0,0 +1,353 @@
+<!--分配用户-->
+<template>
+  <div class="role-auth-user">
+     <el-form :model="queryParams" ref="queryForm" v-show="showSearch" :inline="true" class="form-box">
+      <el-form-item style="margin-right:20px;">
+       <p class="reset-button-one" @click="backPage"><i class="el-icon-arrow-left"></i>返回</p>
+      </el-form-item>
+       <el-col :span="1.5" style="margin-right:20px;">
+         <p class="add-button-one-120"
+            @click="openSelectUser"
+         ><i class="el-icon-plus"></i>添加用户</p>
+       </el-col>
+      <el-form-item label="姓名" prop="nickName">
+        <el-input
+          v-model="queryParams.nickName"
+          placeholder="请输入姓名"
+          clearable
+          maxlength="10"
+          size="small"
+          style="width: 240px"
+        />
+      </el-form-item>
+       <!--<el-form-item label="身份" prop="dictType">-->
+         <!--<el-select v-model="queryParams.userType" placeholder="请选择身份" clearable size="small">-->
+           <!--<el-option-->
+             <!--v-for="dict in userTypeList"-->
+             <!--:key="dict.deptId"-->
+             <!--:label="dict.deptName"-->
+             <!--:value="dict.deptId"-->
+           <!--&gt;</el-option>-->
+         <!--</el-select>-->
+       <!--</el-form-item>-->
+       <el-form-item label="工号/学号" prop="userName">
+         <el-input
+           v-model="queryParams.userName"
+           placeholder="请输入工号/学号"
+           clearable
+           maxlength="20"
+           size="small"
+           style="width: 240px"
+         />
+       </el-form-item>
+      <el-form-item label="联系方式" prop="phonenumber">
+        <el-input
+          v-model="queryParams.phonenumber"
+          placeholder="请输入联系方式"
+          clearable
+          maxlength="13"
+          size="small"
+          style="width: 240px"
+        />
+      </el-form-item>
+       <el-form-item label="学院" prop="deptId">
+         <el-select v-model="queryParams.deptId" placeholder="请选择学院" clearable size="small">
+           <el-option
+             v-for="dict in deptOptions"
+             :key="dict.deptId"
+             :label="dict.deptName"
+             :value="dict.deptId"
+           ></el-option>
+         </el-select>
+       </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+    </el-form>
+
+    <div class="sheet-expand-box">
+      <i class="el-icon-warning" style="color:#0045AF;"></i>
+      <p class="color_99">已选择 {{selectedNum}} 项</p>
+      <p class="color_one cursor_hover" @click="selectPage">全选本页</p>
+      <p class="color_warn cursor_hover" @click="clearSelection">清除选项</p>
+      <p class="color_FF6666 border-solid-color-FF6666  cursor_hover"
+         @click="cancelAuthUserAll">批量取消授权</p>
+    </div>
+    <el-table v-loading="loading" border :data="userList" @selection-change="handleSelectionChange" ref="multipleTable" :row-key="getRowKeys">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="姓名" prop="nickName" align="left" :show-overflow-tooltip="true" />
+      <el-table-column label="工号/学号" prop="userName" align="left" :show-overflow-tooltip="true" />
+      <el-table-column label="联系方式" prop="phonenumber" align="left" :show-overflow-tooltip="true" />
+      <el-table-column label="学院" prop="deptName" align="left" :show-overflow-tooltip="true" />
+      <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="160">
+        <template slot-scope="scope">
+          <div class="table-button-box">
+            <p class="table-button-null"></p>
+            <p class="table-button-p"
+               @click="cancelAuthUser(scope.row)"
+            >取消授权</p>
+            <p class="table-button-null"></p>
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      layout="total, prev, pager, next, sizes, jumper"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+    <select-user ref="select" :postId="postId" @ok="handleQuery" />
+  </div>
+</template>
+
+<script>
+import { positionByList, relieveUserByPosition, authUserCancelAll } from "@/apiDemo/system/user";
+import { listDepartments } from "@/apiDemo/system/dept";
+import selectUser from "./selectUser";
+
+export default {
+  props: {
+    postId: {},
+  },
+  name: "AuthUser",
+  components: { selectUser },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中用户组
+      userIds: [],
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 用户表格数据
+      userList: [],
+      // 状态数据字典
+      statusOptions: [],
+      //学院
+      deptOptions:[],
+      // 角色身份
+      userTypeList:[
+        {
+          deptId:"11",
+          deptName:"教职工"
+        },
+        {
+          deptId:"22",
+          deptName:"学生"
+        },
+      ],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize:20,
+        deptId: '',
+        userName: '',
+        nickName: '',
+        phonenumber: ''
+      },
+      //表格扩展选择器---需要在@selection-change绑定的方法内监控selection数组长度
+      selectedNum:0,
+    };
+  },
+  created() {
+    const postId = this.postId;
+    // const roleId = this.$route.params && this.$route.params.roleId;
+    if (postId) {
+      this.queryParams.position = postId;
+      this.getList();
+      this.getDicts("sys_normal_disable").then(response => {
+        this.statusOptions = response.data;
+      });
+    }
+    this.getDeptList();
+  },
+  methods: {
+    /** 查询学院列表 */
+    getDeptList()
+    {
+      listDepartments().then(response => {
+        // this.deptOptions = response.data;
+        this.$set(this, 'deptOptions', response.data)
+      });
+    },
+    //=========表格扩展选择器方法---开始=========
+    //选择本页
+    selectPage(){
+      console.log(this.$refs.multipleTable)
+      this.$refs.multipleTable.toggleAllSelection()
+      // console.log(this.$refs.multipleTable.selection)
+    },
+    //清除选择
+    clearSelection(){
+      this.$refs.multipleTable.clearSelection()
+    },
+    /*===记录勾选数据===
+      需要再el-table 添加  :row-key="getRowKeys"
+      需要在selection 添加 :reserve-selection="true"
+    */
+    getRowKeys(row) {
+      return row.id
+    },
+    //=========表格扩展选择器方法---结束=========
+    //返回按钮
+    backPage(){
+      this.$parent.clickPage(1);
+    },
+    /** 查询授权用户列表 */
+    getList() {
+      this.loading = true;
+      positionByList(this.queryParams).then(response => {
+          this.userList = response.rows;
+          this.total = response.total;
+          this.loading = false;
+        }
+      );
+    },
+    // 返回按钮
+    handleClose() {
+      this.$store.dispatch("tagsView/delView", this.$route);
+      this.$router.push({ path: "/system/role" });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.$set(this.queryParams,'pageNum',1);
+      this.$set(this.queryParams,'pageSize',20);
+      this.$set(this.queryParams,'nickName','');
+      this.$set(this.queryParams,'userName','');
+      this.$set(this.queryParams,'phonenumber','');
+      this.$set(this.queryParams,'deptId','');
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.selectedNum = selection.length;
+      this.userIds = selection.map(item => item.userId)
+      this.multiple = !selection.length
+    },
+    /** 打开授权用户表弹窗 */
+    openSelectUser() {
+      this.$refs.select.show();
+    },
+    /** 取消授权按钮操作 */
+    cancelAuthUser(row) {
+      const postId = this.postId;
+      this.$confirm('确认要取消该用户的授权吗？', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(function() {
+        return relieveUserByPosition({ userId: row.userId, position: postId });
+      }).then(() => {
+        this.getList();
+        this.msgSuccess("取消授权成功");
+      }).catch(() => {});
+    },
+    /** 批量取消授权按钮操作 */
+    cancelAuthUserAll(row) {
+      if(this.multiple){
+        return
+      }
+      const postId = this.postId;
+      const userIds = this.userIds.join(",");
+      this.$confirm('是否取消选中用户授权数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+      }).then(() => {
+          return relieveUserByPosition({ position: postId, userIds: userIds });
+      }).then(() => {
+        this.getList();
+        this.msgSuccess("取消授权成功");
+      }).catch(() => {});
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+  .role-auth-user {
+    flex:1;
+    display: flex!important;
+    flex-direction: column;
+    margin-top:9px;
+    padding-bottom:8px;
+    overflow: hidden;
+    .form-box{
+    }
+    .button-box{
+      width:120px;
+      display: flex;
+    }
+    .sheet-expand-box{
+      height:40px;
+      display:flex;
+      background:rgba(1,131,250,0.1);
+      border-radius: 5px;
+      margin-bottom:18px;
+      font-size:14px;
+      i{
+        margin:10px 16px 0 14px;
+        height:20px;
+        width:20px;
+        font-size:20px;
+        display: block;
+      }
+      p{
+        margin:0;
+      }
+      p:nth-child(2){
+        width:132px;
+        font-size:14px;
+        height:40px;
+        line-height:40px;
+      }
+      p:nth-child(3){
+        width:60px;
+        font-size:14px;
+        height:40px;
+        line-height:40px;
+        margin-right:20px;
+      }
+      p:nth-child(4){
+        width:60px;
+        font-size:14px;
+        height:40px;
+        line-height:40px;
+        margin-right:20px;
+      }
+      p:nth-child(5){
+        font-size:14px;
+        line-height:30px;
+        width: 100px;
+        height: 30px;
+        border-radius: 6px;
+        text-align: center;
+        margin-top:5px;
+        margin-right:20px;
+      }
+      p:nth-child(6){
+        font-size:14px;
+        line-height:30px;
+        width: 100px;
+        height: 30px;
+        border-radius: 6px;
+        text-align: center;
+        margin-top:5px;
+      }
+    }
+  }
+</style>

src/views/integratedManagement/personnelManage/post/index.vue

@@ -0,0 +1,358 @@
+<template>
+  <div class="app-container post-page">
+    <div class="page-container post-page-min" v-if="pageType == 1">
+      <div class="page-form-title-box">
+        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px" >
+        <el-form-item label="关键字" prop="searchValue">
+          <el-input
+            v-model="queryParams.searchValue"
+            placeholder="请输入身份编码"
+            clearable
+            size="small"
+          />
+        </el-form-item>
+        <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
+        <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
+          <p class="page-add-common-style-button"
+             style="float: right;"
+             @click="handleAdd"
+             v-hasPermi="['system:post:add']"
+          >新增</p>
+      </el-form>
+      </div>
+      <div class="page-content-box">
+        <el-table class="table-box" v-loading="loading" border :data="postList" @selection-change="handleSelectionChange">
+          <el-table-column label="序号"  width="55" align="center"  type="index"/>
+          <el-table-column label="身份名称" align="left" prop="postName" :show-overflow-tooltip="true" width="200"/>
+          <el-table-column label="身份编码" align="left" prop="postCode" :show-overflow-tooltip="true" width="200"/>
+          <el-table-column label="权限组" align="left" prop="roleNameStr" :show-overflow-tooltip="true"/>
+          <el-table-column label="创建时间" align="left" prop="createTime" width="180">
+            <template slot-scope="scope">
+              <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="180">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <!--<p class="table-button-p"-->
+                   <!--@click="handleAuthUser(scope.row)"-->
+                <!--&gt;成员维护</p>-->
+                <p class="table-button-p"
+                   v-hasPermiRouter="['system:post:query','system:post:edit']"
+                   @click="moreClick({row:scope.row,command:1})"
+                >编辑</p>
+                <p class="table-button-p"
+                   v-hasPermiRouter="['system:post:remove']"
+                   @click="moreClick({row:scope.row,command:2})"
+                >删除</p>
+                <!--<el-dropdown @command="moreClick" v-hasPermi="['system:post:query','system:post:edit','system:post:remove']">-->
+                  <!--<p class="table-button-p">更多>></p>-->
+                  <!--<el-dropdown-menu slot="dropdown">-->
+                    <!--<el-dropdown-item style="border-bottom:1px solid #E0E0E0;margin:0 10px;" :command="{row:scope.row,command:1}"-->
+                                      <!--v-hasPermiAnd="['system:post:query','system:post:edit']">编辑</el-dropdown-item>-->
+                    <!--<el-dropdown-item style="margin:0 10px;" :command="{row:scope.row,command:2}"-->
+                                      <!--v-hasPermi="['system:post:remove']">删除</el-dropdown-item>-->
+                  <!--</el-dropdown-menu>-->
+                <!--</el-dropdown>-->
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    layout="total, prev, pager, next, sizes, jumper"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <!-- 添加或修改身份对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body
+               :close-on-click-modal="false">
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="身份名称" prop="postName">
+          <el-input v-model="form.postName" placeholder="请输入身份名称" maxlength="10" />
+        </el-form-item>
+        <el-form-item label="身份编码" prop="postCode">
+          <el-input v-model="form.postCode" placeholder="请输入编码名称" maxlength="20" />
+        </el-form-item>
+        <el-form-item label="权限组" prop="roleIds">
+          <el-select
+            style="width:380px;"
+            v-model="form.roleIds"
+            multiple
+            collapse-tags
+            placeholder="请选择">
+            <el-option
+              v-for="item in optionselectList"
+              :key="item.roleId"
+              :label="item.roleName"
+              :value="item.roleId">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel">取 消</el-button>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!--分配用户-->
+    <auth-user :postId="postId" v-if="pageType == 2"></auth-user>
+  </div>
+</template>
+
+<script>
+  import { positionByList } from "@/apiDemo/system/user";
+import { listPost, getPost, delPost, addPost, updatePost, optionselect } from "@/apiDemo/system/post";
+import authUser from "./authUser.vue";
+
+  // V3
+  import { systemRoleDropList } from "@/api/commonality/permission.js";
+  import { systemPostList,systemPostAdd,systemPostUpdate,systemPostDetail,systemPostDelete } from "@/api/integratedManagement/index";
+
+export default {
+  components: {
+    authUser,
+  },
+  name: "Post",
+  data() {
+    return {
+      isShow:true,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 身份表格数据
+      postList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 状态数据字典
+      statusOptions: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize:20,
+        searchValue: null,
+        postCode: undefined,
+        postName: undefined,
+        status: undefined
+      },
+      // 表单参数
+      form: {},
+      pageType:1,
+      postId:"",
+      // 表单校验
+      rules: {
+        postName: [
+          { required: true, message: "请输入身份名称", trigger: "blur" },
+          { required: true, message: "请输入身份名称", validator: this.spaceJudgment, trigger: "blur" }
+        ],
+        postCode: [
+          { required: true, message: "请输入身份编码", trigger: "blur" },
+          { required: true, message: "请输入身份编码", validator: this.spaceJudgment, trigger: "blur" }
+        ],
+        postSort: [
+          { required: true, message: "请输入身份顺序", trigger: "blur" },
+          { required: true, message: "请输入身份顺序", validator: this.spaceJudgment, trigger: "blur" }
+        ],
+        roleIds: [
+          { required: true, message: "请选择权限组", trigger: "blur" },
+          { required: true, message: "请选择权限组", validator: this.spaceJudgment, trigger: "blur" }
+        ]
+      },
+      //权限组列表
+      optionselectList:[],
+    };
+  },
+  created() {
+    this.getList();
+    this.systemRoleDropList();
+  },
+  methods: {
+    //更多选项
+    moreClick(item){
+      let self = this;
+      if(item.command == 1){
+        this.handleUpdate(item.row)
+      }else if(item.command == 2){
+        this.$confirm('是否确认删除身份?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          self.handleDelete(item.row)
+        }).then(() => {
+        }).catch(() => {});
+      }
+    },
+    clickPage(type){
+      if(this.pageType != type){
+        this.pageType = type;
+      }
+    },
+    /** 查询身份列表 */
+    getList() {
+      let self = this;
+      this.loading = true;
+      systemPostList(this.queryParams).then(response => {
+        for(let i=0;i<response.data.records.length;i++){
+          let roleIds = response.data.records[i].roleIds?response.data.records[i].roleIds.split(','):[];
+          let roleName = '';
+          for(let o=0;o<roleIds.length;o++){
+            for(let x=0;x<self.optionselectList.length;x++){
+              if(roleIds[o] == self.optionselectList[x].roleId){
+                roleName = roleName + (roleName[0]?'，':'') + self.optionselectList[x].roleName
+              }
+            }
+          }
+          response.data.records[i].roleNameStr = roleName;
+        }
+        this.postList = response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    //角色下拉列表
+    systemRoleDropList(){
+      systemRoleDropList({}).then(response => {
+          this.$set(this,'optionselectList',response.data);
+        }
+      );
+    },
+    // 身份状态字典翻译
+    statusFormat(row, column) {
+      return this.selectDictLabel(this.statusOptions, row.status);
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        postId: undefined,
+        postCode: undefined,
+        postName: undefined,
+        postSort: 0,
+        remark: undefined
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams.searchValue='';
+      // this.resetForm("queryForm");
+      this.$set(this,'queryParams',{
+        pageNum: 1,
+        pageSize:20,
+        searchValue:"",
+      });
+      this.handleQuery();
+    },
+    /** 分配用户操作 */
+    handleAuthUser: function(row) {
+      if(row.roleIds){
+        this.postId=row.postId;
+        this.pageType=2;
+      }else{
+        this.msgError('未配置权限组的身份无法分配用户')
+      }
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.postId)
+      this.single = selection.length!=1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "新增身份";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      console.log('row=>',row);
+      systemPostDetail({postId:row.postId}).then(response => {
+        if(response.data.roleIds){
+          response.data.roleIds = response.data.roleIds.split(',')
+          // for(let i=0;i<response.data.roleIds.length;i++){
+          //   response.data.roleIds[i] = parseInt(response.data.roleIds[i]);//字符串转数字
+          // }
+        }
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改身份";
+      });
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          let obj = JSON.parse(JSON.stringify(this.form))
+          obj.roleIds = obj.roleIds+'';
+          if (this.form.postId != undefined) {
+            systemPostUpdate(obj).then(response => {
+              this.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            systemPostAdd(obj).then(response => {
+              this.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      systemPostDelete({postId:row.postId}).then(response => {
+        this.getList();
+        this.msgSuccess("删除成功");
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('system/post/export', {
+        ...this.queryParams
+      }, `post_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>
+<style scoped lang="scss">
+  .post-page{
+    .post-page-min{
+      .button-box{
+        width:340px;
+        display: flex;
+      }
+    }
+  }
+</style>

src/views/integratedManagement/personnelManage/post/selectUser.vue

@@ -0,0 +1,281 @@
+<template>
+  <!-- 授权用户 -->
+  <el-dialog title="选择用户" :visible.sync="visible" width="1540px" top="5vh" append-to-body class="role-select-user"
+             :close-on-click-modal="false">
+    <el-form :model="queryParams" ref="queryForm" :inline="true">
+      <el-form-item label="姓名" prop="nickName">
+        <el-input
+          v-model="queryParams.nickName"
+          placeholder="请输入姓名"
+          maxlength="10"
+          clearable
+          size="small"
+        />
+      </el-form-item>
+      <el-form-item label="工号/学号" prop="userName">
+        <el-input
+          v-model="queryParams.userName"
+          placeholder="请输入工号/学号"
+          clearable
+          maxlength="20"
+          size="small"
+          style="width: 240px"
+        />
+      </el-form-item>
+      <el-form-item label="联系方式" prop="phonenumber">
+        <el-input
+          v-model="queryParams.phonenumber"
+          placeholder="请输入联系方式"
+          clearable
+          size="small"
+        />
+      </el-form-item>
+      <el-form-item label="学院" prop="deptId">
+        <el-select v-model="queryParams.deptId" placeholder="请选择学院" clearable size="small">
+          <el-option
+            v-for="dict in deptOptions"
+            :key="dict.deptId"
+            :label="dict.deptName"
+            :value="dict.deptId"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+    </el-form>
+    <el-row>
+      <el-table @row-click="clickRow" border ref="table" :data="userList" @selection-change="handleSelectionChange" height="400px" :row-key="getRowKeys">
+        <el-table-column type="selection" width="55" align="center"></el-table-column>
+        <el-table-column label="姓名" prop="nickName" align="left" :show-overflow-tooltip="true" />
+        <el-table-column label="工号/学号" prop="userName" align="left" :show-overflow-tooltip="true" />
+        <el-table-column label="联系方式" prop="phonenumber" align="left" :show-overflow-tooltip="true" />
+        <el-table-column label="学院" prop="deptName" align="left" :show-overflow-tooltip="true" />
+      </el-table>
+      <pagination :page-sizes="[20, 30, 40, 50]"
+        v-show="total>0"
+        :total="total"
+        layout="total, prev, pager, next, sizes, jumper"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </el-row>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">取 消</el-button>
+      <el-button type="primary" @click="handleSelectUser">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { noJoinPositionByList, bingUserByPosition } from "@/apiDemo/system/user";
+import { listDepartments } from "@/apiDemo/system/dept";
+export default {
+  props: {
+    // 角色编号
+    postId: {}
+  },
+  data() {
+    return {
+      // 遮罩层
+      visible: false,
+      // 选中数组值
+      userIds: [],
+      //学院
+      deptOptions:[],
+      // 角色身份
+      userTypeList:[
+        {
+          deptId:"11",
+          deptName:"教职工"
+        },
+        {
+          deptId:"22",
+          deptName:"学生"
+        },
+      ],
+      // 总条数
+      total: 0,
+      // 未授权用户数据
+      userList: [],
+      // 状态数据字典
+      statusOptions: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize:20,
+        postId: '',
+        nickName: '',
+        userName: '',
+        phonenumber: '',
+        deptId: '',
+      },
+      //表格扩展选择器---需要在@selection-change绑定的方法内监控selection数组长度
+      selectedNum:0,
+    };
+  },
+  created() {
+    this.getDicts("sys_normal_disable").then(response => {
+      this.statusOptions = response.data;
+    });
+    console.log(this.postId)
+    this.getDeptList();
+  },
+  methods: {
+    /** 查询学院列表 */
+    getDeptList()
+    {
+      listDepartments().then(response => {
+        // this.deptOptions = response.data;
+        this.$set(this, 'deptOptions', response.data)
+      });
+    },
+    selectAll(){
+
+    },
+    //=========表格扩展选择器方法---开始=========
+    //选择本页
+    selectPage(){
+      console.log(this.$refs.multipleTable)
+      this.$refs.table.toggleAllSelection()
+      // console.log(this.$refs.multipleTable.selection)
+    },
+    //清除选择
+    clearSelection(){
+      this.$refs.table.clearSelection()
+    },
+    /*===记录勾选数据===
+      需要再el-table 添加  :row-key="getRowKeys"
+      需要在selection 添加 :reserve-selection="true"
+    */
+    getRowKeys(row) {
+      return row.id
+    },
+    //=========表格扩展选择器方法---结束=========
+    // 显示弹框
+    show() {
+      this.queryParams.postId = this.postId;
+      this.queryParams.pageNum = 1;
+      this.queryParams.nickName = '';
+      this.queryParams.userName = '';
+      this.queryParams.phonenumber = '';
+      this.queryParams.deptId = '';
+      this.getList();
+      this.visible = true;
+    },
+    clickRow(row) {
+      this.$refs.table.toggleRowSelection(row);
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.userIds = selection.map(item => item.userId);
+    },
+    // 查询表数据
+    getList() {
+      noJoinPositionByList(this.queryParams).then(res => {
+        this.userList = res.rows;
+        this.total = res.total;
+      });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      // this.resetForm("queryForm");
+      this.$set(this,'queryParams',{
+        pageNum: 1,
+        pageSize:20,
+        postId: '',
+        nickName: '',
+        userName: '',
+        phonenumber: '',
+        deptId: '',
+      });
+      this.handleQuery();
+    },
+    /** 选择授权用户操作 */
+    handleSelectUser() {
+      if(!this.userIds[0]){
+        this.msgError('请选择要添加的用户')
+        return
+      }
+      const postId = this.queryParams.postId;
+      const userIds = this.userIds.join(",");
+      bingUserByPosition({ position: postId, userIds: userIds }).then(res => {
+        this.msgSuccess(res.msg);
+        if (res.code === 200) {
+          this.visible = false;
+          this.$emit("ok");
+        }
+      });
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+  .role-select-user {
+    .sheet-expand-box{
+      height:40px;
+      display:flex;
+      background:rgba(1,131,250,0.1);
+      border-radius: 5px;
+      margin-bottom:18px;
+      font-size:14px;
+      i{
+        margin:10px 16px 0 14px;
+        height:20px;
+        width:20px;
+        font-size:20px;
+        display: block;
+      }
+      p{
+        margin:0;
+      }
+      p:nth-child(2){
+        width:132px;
+        font-size:14px;
+        height:40px;
+        line-height:40px;
+      }
+      p:nth-child(3){
+        width:60px;
+        font-size:14px;
+        height:40px;
+        line-height:40px;
+        margin-right:20px;
+      }
+      p:nth-child(4){
+        width:60px;
+        font-size:14px;
+        height:40px;
+        line-height:40px;
+        margin-right:20px;
+      }
+      p:nth-child(5){
+        font-size:14px;
+        line-height:30px;
+        width: 100px;
+        height: 30px;
+        border-radius: 6px;
+        text-align: center;
+        margin-top:5px;
+        margin-right:20px;
+      }
+      p:nth-child(6){
+        font-size:14px;
+        line-height:30px;
+        width: 100px;
+        height: 30px;
+        border-radius: 6px;
+        text-align: center;
+        margin-top:5px;
+      }
+    }
+  }
+</style>

src/views/integratedManagement/personnelManage/studentInfo/addPage.vue

@@ -58,16 +58,11 @@
         </el-form-item>
         <el-form-item label="身份：" prop="position">
           <el-select
+            @change="positionSelectClick"
             :disabled="editType"
             v-model="form.position"
             filterable
-            remote
-            clearable
-            reserve-keyword
-            @change="positionSelectClick"
-            @clear="positionClearClick"
-            placeholder="请选择身份"
-            :remote-method="positionSelect">
+            placeholder="请选择班级">
             <el-option
               v-for="item in positionOptions"
               :key="item.postId"
@@ -257,7 +252,8 @@ import addPageSubPagePublic from './differenceComponent/addPageSubPagePublic.vue
 import addPageSubPageSZDX from './differenceComponent/addPageSubPageSZDX.vue'
 
 //V3新
-import { getDeptList,systemUserAdd,systemUserUpdate,getDeptDropList,systemUserSelect,systemUserMajorSelect } from "@/api/commonality/permission";
+import { getDeptList,systemUserAdd,systemUserUpdate,getDeptDropList,
+  systemUserSelect,systemUserMajorSelect,systemPostSelect } from "@/api/commonality/permission";
 import { getDicts } from "@/api/commonality/noPermission";
 export default {
   name: "addPage",
@@ -381,7 +377,8 @@ export default {
         this.form.account = '';
       }
       if(this.propsData.position){
-        this.form.position = parseInt(this.propsData.position);
+        // this.form.position = parseInt(this.propsData.position);
+        this.form.position = this.propsData.position;
       }else{
         this.form.position = '';
       }
@@ -430,9 +427,6 @@ export default {
       }else{
         this.form.cardNum = '';
       }
-    }else{
-      // this.positionSelectAll();
-      // this.positionSelect();
     }
   },
   mounted(){
@@ -502,6 +496,7 @@ export default {
     },
     //查询所有搜索接口数据
     getAll(){
+      this.systemPostSelect();
       //获取学院
       getDeptDropList({level:2,deptType:1}).then(response => {
         this.$set(this,'deptOptions',response.data);
@@ -569,26 +564,8 @@ export default {
         }
       });
     },
-    positionSelectAll(){
-      let obj = {
-        postName:'',
-      };
-      optionselect(obj).then(response => {
-        let list = [];
-        for(let i=0;i<response.data.length;i++){
-          if(response.data[i].roleIds){
-            list.push(response.data[i]);
-          }
-        }
-        this.$set(this,'positionOptions',list)
-      });
-    },
-    //查询身份
-    positionSelect(query){
-      let obj = {
-        postName:query,
-      };
-      optionselect(obj).then(response => {
+    systemPostSelect(){
+      systemPostSelect({}).then(response => {
         let list = [];
         for(let i=0;i<response.data.length;i++){
           if(response.data[i].roleIds){
@@ -605,16 +582,9 @@ export default {
         let num = 0;
         for(let i=0;i<self.positionOptions.length;i++){
           if(self.form.position == self.positionOptions[i].postId && self.positionOptions[i].roleIds){
-            let list = self.positionOptions[i].roleIds.split(',')
-            let newList = [];
-            for(let o=0;o<list.length;o++){
-              for(let s=0;s<self.roleOptionselectOptions.length;s++){
-                if(list[o] == self.roleOptionselectOptions[s].roleId){
-                  newList.push(parseInt(list[o]));
-                }
-              }
-            }
-            self.$set(self.form,'roleIds',newList);
+            let list = self.positionOptions[i].roleIds
+            self.$set(self.form,'roleIds',list);
+            self.$set(self.form,'positionName',self.positionOptions[i].postName);
             num++
           }
         }
@@ -624,10 +594,6 @@ export default {
       }
       this.$forceUpdate();
     },
-    positionClearClick(){
-      // this.$set(this.form,'roleIds',[])
-      this.positionSelectAll();
-    },
     //*************************导师查询
     tutorUserSelect(query){
       if (query !== '') {

src/views/integratedManagement/personnelManage/teacherInfo/addPage.vue

@@ -60,16 +60,11 @@
           </el-form-item>
           <el-form-item label="身份：" prop="position">
             <el-select
+              @change="positionSelectClick"
               :disabled="editType"
               v-model="form.position"
               filterable
-              remote
-              clearable
-              reserve-keyword
-              @change="positionSelectClick"
-              @clear="positionClearClick"
-              placeholder="请选择身份"
-              :remote-method="positionSelect">
+              placeholder="请选择班级">
               <el-option
                 v-for="item in positionOptions"
                 :key="item.postId"
@@ -178,7 +173,7 @@ import { addSystemPermit } from "@/apiDemo/laboratory/managePermissionTemplates"
 import Treeselect from "@riophae/vue-treeselect";
 
 //V3新
-import { getDeptList,systemUserAdd,systemUserUpdate } from "@/api/commonality/permission";
+import { getDeptList,systemUserAdd,systemUserUpdate,systemPostSelect } from "@/api/commonality/permission";
 import { getDicts } from "@/api/commonality/noPermission";
 
 export default {
@@ -314,7 +309,8 @@ export default {
         this.form.deptId = '';
       }
       if(this.propsData.position){
-        this.form.position =  parseInt(this.propsData.position);
+        // this.form.position =  parseInt(this.propsData.position);
+        this.form.position =  this.propsData.position;
       }else{
         this.form.position = '';
       }
@@ -426,16 +422,7 @@ export default {
       });
     },
     getAll(){
-      //身份
-      // optionselect({postName:""}).then(response => {
-      //   let list = [];
-      //   for(let i=0;i<response.data.length;i++){
-      //     if(response.data[i].roleIds){
-      //       list.push(response.data[i]);
-      //     }
-      //   }
-      //   this.$set(this,'positionOptions',list)
-      // });
+      this.systemPostSelect();
       //职称字典
       getDicts('professional').then(response => {
         this.categoryOptions = response.data;
@@ -445,6 +432,17 @@ export default {
         this.educationOptions = response.data;
       });
     },
+    systemPostSelect(){
+      systemPostSelect({}).then(response => {
+        let list = [];
+        for(let i=0;i<response.data.length;i++){
+          if(response.data[i].roleIds){
+            list.push(response.data[i]);
+          }
+        }
+        this.$set(this,'positionOptions',list)
+      });
+    },
     //查询身份
     positionSelect(query){
       if (query !== '') {
@@ -472,23 +470,16 @@ export default {
         });
       }
     },
-    positionSelectClick(){
+    positionSelectClick(data){
       //选中
       let self = this;
       if(this.form.position){
         let num = 0;
         for(let i=0;i<self.positionOptions.length;i++){
           if(self.form.position == self.positionOptions[i].postId && self.positionOptions[i].roleIds){
-            let list = self.positionOptions[i].roleIds.split(',')
-            let newList = [];
-            for(let o=0;o<list.length;o++){
-              for(let s=0;s<self.roleOptionselectOptions.length;s++){
-                if(list[o] == self.roleOptionselectOptions[s].roleId){
-                  newList.push(parseInt(list[o]));
-                }
-              }
-            }
-            self.$set(self.form,'roleIds',newList);
+            let list = self.positionOptions[i].roleIds
+            self.$set(self.form,'roleIds',list);
+            self.$set(self.form,'positionName',self.positionOptions[i].postName);
             num++
           }
         }
@@ -498,19 +489,6 @@ export default {
       }
       this.$forceUpdate();
     },
-    positionClearClick(){
-      //清空
-      // this.$set(this.form,'roleIds',[])
-      optionselect({postName:""}).then(response => {
-        let list = [];
-        for(let i=0;i<response.data.length;i++){
-          if(response.data[i].roleIds){
-            list.push(response.data[i]);
-          }
-        }
-        this.$set(this,'positionOptions',list)
-      });
-    },
     /** 查询部门下拉树结构 */
     getDeptList() {
       getDeptList({deptName:''}).then(response => {