zc

src/api/medicUniversity-3_1/index.js

@@ -664,10 +664,45 @@ export function listUser(query) {
   })
 }
 
-// 审批详情
+// 审批详情(审批)
 export function hxpapplyAudit(id) {
   return request({
     url: '/chemical/hxpapply/audit/'+id,
     method: 'get',
   })
 }
+
+// 审批详情
+export function hxpapply(id) {
+  return request({
+    url: '/chemical/hxpapply/'+id,
+    method: 'get',
+  })
+}
+
+//申购审批接口
+export function approvalTask(data) {
+  return request({
+    url: '/chemical/applytask/approvalTask',
+    method: 'put',
+    data: data
+  })
+}
+
+//申购拒绝接口
+export function approvalRefuse(data) {
+  return request({
+    url: '/chemical/applytask/approvalRefuse',
+    method: 'put',
+    data: data
+  })
+}
+
+// 审批详情
+export function getRestStockByManyCabinet(query) {
+  return request({
+    url: '/chemical/hxpapply/getRestStockByManyCabinet',
+    method: 'get',
+    params: query
+  })
+}

src/api/studentApi/chemicalManagement/index.js

@@ -61,3 +61,12 @@ export function getHxpapplyMyDraftsList(query) {
     params: query
   })
 }
+
+
+//查询编辑详情
+export function getHxpapply(id) {
+  return request({
+    url: '/chemical/hxpapply/myInfo/'+id,
+    method: 'get',
+  })
+}

src/views/medicUniversity-3_1/chemicalManagement/chemicalLibrary/ChemicalInfo/listPage.vue

@@ -102,6 +102,7 @@
             <div class="for-max-title-box">
               <p></p>
               <p>{{item.name}}</p>
+              <p>{{item.maxNum}}g</p>
             </div>
             <div class="for-big-box" v-for="(bigItem,bigIndex) in item.chemicalJoinCabinetSonList">
               <p class="for-big-title-p">{{bigItem.lockName}}</p>
@@ -153,6 +154,7 @@
             <div class="for-max-title-box">
               <p></p>
               <p>{{item.name}}</p>
+              <p>{{item.maxNum}}g</p>
             </div>
             <div class="for-big-box">
               <div class="for-big-for-max-box">
@@ -208,7 +210,7 @@
 </template>
 
 <script>
-  import { getHxpChemicalJoinCabinet,delHxpChemicalJoinCabinet,filterDept,getSubList,getCabinetBySubId,hxpChemicalJoinCabinet } from "@/api/medicUniversity-3_1/index";
+  import { getHxpChemicalJoinCabinet,delHxpChemicalJoinCabinet,filterDept,getSubList,getCabinetBySubId,hxpChemicalJoinCabinet,getRestStockByManyCabinet } from "@/api/medicUniversity-3_1/index";
   import { getLogoInfo } from "@/api/system/publicConfig";
   export default {
     name: "listPage",
@@ -216,16 +218,14 @@
       listPropsData:{},
     },
     data() {
-      const jisuan = (rule, value, callback) => {
-        // console.log("rule",rule)//field: "maxList.1.list.0.chemicalAmount"
-        // 这个index是本item的index
-        // const i = rule.field.split('.')[0].indexOf('[');
-        // const index = rule.field.split('.')[0].slice(i + 1, rule.field.split('.')[0].length - 1);
-        // // 这个itemAttrs里面有传递的参数id
-        // const itemAttrs = this.$refs[`dayBegin[${index}]`][0] ? this.$refs[`dayBegin[${index}]`][0].$attrs : null;
-        if (this.form.confirmPassword !== value) {
-          callback(new Error("两次输入的密码不一致"));
-        } else {
+      const computingCapacity = (rule, value, callback) => {
+        console.log('rule',rule)
+        const list = rule.field.split('.');
+        let index = parseInt(list[1]);
+        let max = parseInt(this.dialogData.maxList[index].maxNum);
+        if(value>max){
+            callback(new Error("超出该机柜可存放量"));
+        }else{
           callback();
         }
       };
@@ -272,7 +272,7 @@
           chemicalAmount:[
             { required: true, message: '请输入容器容量', trigger: 'blur' },
             { required: true, message: "请输入容器容量", validator: this.spaceJudgment, trigger: "blur" },
-            // { required: true, message: "请输入容器容量", validator: jisuan, trigger: "blur" }
+            { required: true, message: "超出该机柜可存放量", validator: computingCapacity, trigger: "blur" },
           ],
           tare:[
             { required: true, message: '请输入容器自重', trigger: 'blur' },
@@ -429,7 +429,31 @@
                 list.push(obj);
               }
             }
-            this.$set(this.dialogData,"maxList",list);
+            let newObj = {
+              chemicalId:self.listPropsData.id,
+              cabinetIds:"",
+            }
+            for(let i=0;i<list.length;i++){
+              if(i==0){
+                newObj.cabinetIds = list[i].cabinetId;
+              }else{
+                newObj.cabinetIds = newObj.cabinetIds +','+ list[i].cabinetId;
+              }
+            }
+            if(list[0]){
+              getRestStockByManyCabinet(newObj).then(response => {
+                for(let i=0;i<response.data.length;i++){
+                  for(let o=0;o<list.length;o++){
+                    if(response.data[i].cabinetId == list[o].cabinetId){
+                      list[o].maxNum = response.data[i].restStock;
+                    }
+                  }
+                }
+                this.$set(this.dialogData,"maxList",list);
+              })
+            }else{
+              this.$set(this.dialogData,"maxList",list);
+            }
           });
         }
       },
@@ -602,12 +626,18 @@
           height: 16px;
         }
         p:nth-child(2){
+          flex:1;
           height: 16px;
           font-size: 16px;
           color: #333333;
           line-height: 16px;
           margin-left:12px;
         }
+        p:nth-child(3){
+          font-size:16px;
+          line-height: 16px;
+          color:#0183FA;
+        }
       }
       .for-big-box{
         margin-top:20px;

src/views/medicUniversity-3_1/chemicalManagement/chemicalProcurement/approvalProcess/index.vue

@@ -184,7 +184,7 @@
           let list = [];
           for(let i=0;i<self.dataList.length;i++){
             let bigObj = {
-              auditType:self.dataList.auditType,
+              auditType:self.dataList[i].auditType,
               actAudituser:[],
             };
             for(let o=0;o<self.dataList[i].actAudituserInfo.length;o++){

src/views/medicUniversity-3_1/chemicalManagement/chemicalProcurement/purchaseRequisition/index.vue

@@ -110,10 +110,10 @@
         <el-table-column label="操作" align="center" width="220" class-name="small-padding fixed-width">
           <template slot-scope="scope">
             <div class="button-box">
-              <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3" style="margin-right:10px;" @click="pageToggle(5,scope.row.id)">编辑</p>
+              <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3" style="margin-right:10px;" @click="pageToggle(5,scope.row)">编辑</p>
               <p class="table-min-button" v-show="scope.row.approvalStatus == 1 && !scope.row.lsName" style="margin-right:10px;" @click="approvalRevoke(scope.row)">撤销</p>
-              <p class="table-min-button" v-show="scope.row.approvalStatus == 1" style="margin-right:10px;" @click="pageToggle(6,scope.row.id)">审批</p>
-              <p class="table-min-button" style="margin-right:10px;" @click="pageToggle(7,scope.row.id)">审批单</p>
+              <p class="table-min-button" v-show="scope.row.approvalType == 1" style="margin-right:10px;" @click="pageToggle(6,scope.row)">审批</p>
+              <p class="table-min-button" style="margin-right:10px;" @click="pageToggle(7,scope.row)">审批单</p>
               <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3" @click="delHxpapply(scope.row)">删除</p>
             </div>
           </template>
@@ -200,7 +200,7 @@
     },
     methods: {
       //操作
-      pageToggle(type,id){
+      pageToggle(type,row){
         if(type == 1){
           //返回列表重置搜索项
           this.pageType = 1;
@@ -216,9 +216,9 @@
           this.pageType = 4
         }else if(type == 5){
           //编辑
-          getHxpapply(id).then(response => {
+          getHxpapply(row.id).then(response => {
             let maxObj = {
-              id:id,
+              id:row.id,
               subId:parseInt(response.data.subId),
               applyReason:response.data.applyReason,
               maxList:[],
@@ -257,16 +257,18 @@
         }else if(type == 6){
           //审批
           let obj = {
-            id:id,
+            id:row.id,
             type:1,
+            userType:row.userType
           };
           this.$set(this,'approvalPagePropsData',obj);
           this.pageType = 4;
         }else if(type == 7){
           //审批单
           let obj = {
-            id:id,
+            id:row.id,
             type:2,
+            userType:row.userType
           };
           this.$set(this,'approvalPagePropsData',obj);
           this.pageType = 4;
@@ -325,8 +327,8 @@
           for(let i=0;i<response.rows.length;i++){
             response.rows[i].lsName = "";
             response.rows[i].dqName = "";
-            for(let o=0;o<response.rows[i].currentUserList.length;o++){
-              if( response.rows[i].currentUserList[o].id == userId){
+            for(let o=0;o<response.rows[i].historyUserList.length;o++){
+              if( response.rows[i].historyUserList[o].id == userId){
                 if(o == 0){
                   response.rows[i].lsName = response.rows[i].lsName + '我';
                 }else{
@@ -334,24 +336,26 @@
                 }
               }else{
                 if(o == 0){
-                  response.rows[i].lsName = response.rows[i].lsName + response.rows[i].currentUserList[o].name;
+                  response.rows[i].lsName = response.rows[i].lsName + response.rows[i].historyUserList[o].name;
                 }else{
-                  response.rows[i].lsName = response.rows[i].lsName + '、' + response.rows[i].currentUserList[o].name;
+                  response.rows[i].lsName = response.rows[i].lsName + '、' + response.rows[i].historyUserList[o].name;
                 }
               }
             }
-            for(let o=0;o<response.rows[i].historyUserList.length;o++){
-              if( response.rows[i].historyUserList[o].id == userId){
+            for(let o=0;o<response.rows[i].currentUserList.length;o++){
+              if( response.rows[i].currentUserList[o].id == userId){
                 if(o == 0){
                   response.rows[i].dqName = response.rows[i].dqName + '我';
                 }else{
                   response.rows[i].dqName = response.rows[i].dqName + '、我';
                 }
+                response.rows[i].approvalType = 1;
+                response.rows[i].userType = 1;
               }else{
                 if(o == 0){
-                  response.rows[i].dqName = response.rows[i].dqName + response.rows[i].historyUserList[o].name;
+                  response.rows[i].dqName = response.rows[i].dqName + response.rows[i].currentUserList[o].name;
                 }else{
-                  response.rows[i].dqName = response.rows[i].dqName + '、'+ response.rows[i].historyUserList[o].name;
+                  response.rows[i].dqName = response.rows[i].dqName + '、'+ response.rows[i].currentUserList[o].name;
                 }
               }
 

src/views/medicUniversity-3_1/chemicalManagement/chemicalProcurement/purchaseRequisition/listPageOne.vue

@@ -0,0 +1,258 @@
+<!--化学品柜管理/化学品详情-->
+<template>
+  <div class="listPage">
+    <div class="title-box">
+      <p>{{listPropsData.cabinetName}}-{{listPropsData.posi}}<span>(负责人：{{listPropsData.safeUserName}})</span></p>
+      <p class="reset-button-one" @click="backPage"><i class="el-icon-arrow-left"></i>返回</p>
+    </div>
+    <el-form :model="queryParamsData" ref="queryForm" :inline="true" style="margin:20px 20px 0;">
+      <el-form-item label="关键字" prop="searchValue">
+        <el-input
+          maxlength="20"
+          v-model="queryParamsData.searchValue"
+          placeholder="化学品名/CAS号/编号"
+          clearable
+          size="small"
+        />
+      </el-form-item>
+      <el-form-item label="分类" prop="chemicalClassify">
+        <el-select v-model="queryParamsData.chemicalClassify" clearable placeholder="请选择分类">
+          <el-option
+            v-for="item in optionsListOne"
+            :key="item.id"
+            :label="item.classifyName"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="useStatus">
+        <el-select v-model="queryParamsData.useStatus" clearable placeholder="请选择状态">
+          <el-option
+            v-for="item in optionsListTwo"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="柜锁" prop="lockId" v-if="$store.state.settings.smartAlarmType == 1">
+        <el-select v-model="queryParamsData.lockId" clearable placeholder="请选择柜锁">
+          <el-option
+            v-for="item in optionsListThree"
+            :key="item.id"
+            :label="item.lockName"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+    </el-form>
+    <div class="listPage-min scrollbar-box">
+      <img style="width:300px;margin:100px auto 0;" src="@/assets/ZDimages/null-data-1.png" alt="" v-if="!tableList[0]">
+      <div class="for-max-big-box" v-for="(item,index) in tableList" :key="index">
+        <div class="for-title-box">
+          <p class="for-title-name">{{item.chemicalName}} {{item.casNum}}<span v-for="(minText,index) in item.classifyAttribute">{{minText}}</span></p>
+          <p class="for-title-num">总库存：{{item.totalStock}}</p>
+          <p class="for-title-null">丨</p>
+          <p class="for-title-num">使用中：{{item.useing}}</p>
+          <p class="for-title-null">丨</p>
+          <p class="for-title-num">作废：{{item.cancel}}</p>
+          <p class="for-title-null">丨</p>
+          <p class="for-title-num">用结：{{item.useUp}}</p>
+          <!--<p class="for-title-null">丨</p>-->
+          <!--<p class="for-title-num">未使用：{{item.noUse}}</p>-->
+        </div>
+        <el-table v-loading="loading" border :data="item.hxpCabinetInclusionChemicalSonList" style="margin:30px 0;">
+          <el-table-column label="化学品编号" align="center" prop="joinNum" />
+          <el-table-column label="柜锁名称" align="center" prop="lockName" v-if="$store.state.settings.smartAlarmType == 1"/>
+          <el-table-column label="分类" align="center" prop="classifyName" />
+          <el-table-column label="形态" align="center" prop="chemicalShape" />
+          <el-table-column label="纯度" align="center" prop="purity" />
+          <el-table-column label="容量规格" align="center" prop="chemicalAmountUnit" />
+          <el-table-column label="过期时间" align="center" prop="expireTime" />
+          <el-table-column label="状态" align="center" prop="useStatus" />
+          <el-table-column label="库存净重" align="center" prop="outUsages" />
+        </el-table>
+      </div>
+    </div>
+    <pagination
+      style="margin:20px;"
+      v-show="total>0"
+      :total="total"
+      :page-sizes="[6]"
+      layout="total, prev, pager, next, jumper"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+  import { getCabinetByChemical,classifyList,getHardwareByLockList } from "@/api/medicUniversity-3_1/index";
+  export default {
+    name: "listPage",
+    props:{
+      listPropsData:{},
+    },
+    data() {
+      return {
+        loading:false,
+        //实验室列表
+        optionsListOne:[],
+        //状态列表
+        optionsListTwo:[{id:"1",name:"使用中"},{id:"2",name:"未使用"},{id:"3",name:"超时未归还"},{id:"4",name:"已过期"}],
+        optionsListThree:[],
+        // 搜索数据
+        total:0,
+        queryParamsData:{
+          pageNum:1,
+          pageSize:4,
+        },
+        // 搜索实际发送数据
+        queryParams:{
+          pageNum:1,
+          pageSize:4,
+        },
+        tableList:[]
+      };
+    },
+    created() {
+
+    },
+    mounted(){
+      this.getHardwareByLockList();
+      this.classifyList();
+      this.getList();
+
+    },
+    methods: {
+      //根据化学品柜id获取柜锁
+      getHardwareByLockList(){
+        getHardwareByLockList({joinCabinet:this.listPropsData.id}).then(response => {
+          this.optionsListThree = response.data;
+        });
+      },
+      //获取化学品分类列表
+      classifyList(){
+        classifyList().then(response => {
+          this.optionsListOne = response.rows;
+        });
+      },
+      //获取数据列表
+      getList(){
+        this.queryParamsData = JSON.parse(JSON.stringify(this.queryParams));
+        this.queryParamsData.id = this.listPropsData.id;
+        getCabinetByChemical(this.queryParamsData).then(response => {
+          for(let i=0;i<response.rows.length;i++){
+            if(response.rows[i].classifyAttribute){
+              response.rows[i].classifyAttribute = response.rows[i].classifyAttribute.split(",");
+            }
+          }
+          this.tableList = response.rows;
+          this.total = response.total;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParamsData.pageNum = 1;
+        this.queryParamsData.pageSize = 4;
+        this.queryParams = JSON.parse(JSON.stringify(this.queryParamsData));
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'queryParamsData',{});
+        this.$set(this,'queryParams',{});
+        this.handleQuery();
+      },
+      backPage(){
+        this.$parent.pageToggle(1);
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .listPage {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    p {
+      margin: 0;
+      padding: 0;
+    }
+    .title-box{
+      display: flex;
+      height:90px;
+      border-bottom: 1px solid #D8D8D8;
+      p:nth-child(1){
+        flex:1;
+        font-size:16px;
+        line-height:90px;
+        margin-left:18px;
+        color:#0045AF;
+        span{
+          line-height:14px;
+          color:#333333;
+          font-weight:500;
+          margin-left:20px;
+        }
+      }
+      p:nth-child(2){
+        margin:25px 25px 0 0;
+      }
+    }
+    .listPage-min{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      padding:0 20px 20px;
+      font-weight:500;
+      color:#333333;
+      .for-max-big-box{
+        .for-title-box{
+          display: flex;
+          p{
+            font-size:16px;
+            line-height:20px;
+          }
+          .for-title-name{
+            flex:1;
+            span{
+              margin-left:20px;
+              font-size:14px;
+              padding:0 14px;
+              background: rgba(255, 132, 0, 0.2);
+              color:#FF8400;
+              border-radius:4px;
+            }
+          }
+          .for-title-num{
+
+          }
+          .for-title-null{
+            width:57px;
+            text-align: center;
+          }
+        }
+      }
+    }
+  }
+</style>
+<style lang="scss">
+  .listPage{
+    .listPage-min{
+      .for-max-big-box{
+        .el-table__empty-text{
+          background: #fff!important;
+          color:#999;
+        }
+      }
+    }
+  }
+</style>

src/views/studentViews/chemicalManagement/studentChemicalInfo/addPage.vue

@@ -99,6 +99,7 @@
             <div class="for-max-title-box">
               <p></p>
               <p>{{item.name}}</p>
+              <p>{{item.maxNum}}g</p>
             </div>
             <div class="for-big-box" v-for="(bigItem,bigIndex) in item.chemicalJoinCabinetSonList">
               <p class="for-big-title-p">{{bigItem.lockName}}</p>
@@ -150,6 +151,7 @@
             <div class="for-max-title-box">
               <p></p>
               <p>{{item.name}}</p>
+              <p>{{item.maxNum}}g</p>
             </div>
             <div class="for-big-box">
               <div class="for-big-for-max-box">
@@ -205,7 +207,7 @@
 </template>
 
 <script>
-  import { filterDept,getSubList,getCabinetBySubId,hxpChemicalJoinCabinet } from "@/api/medicUniversity-3_1/index";
+  import { filterDept,getSubList,getCabinetBySubId,hxpChemicalJoinCabinet,getRestStockByManyCabinet } from "@/api/medicUniversity-3_1/index";
   import { getHxpQueryByUser } from "@/api/studentApi/chemicalManagement/index";
   import { getLogoInfo } from "@/api/system/publicConfig";
   export default {
@@ -214,6 +216,17 @@
       listPropsData:{},
     },
     data() {
+      const computingCapacity = (rule, value, callback) => {
+        console.log('rule',rule)
+        const list = rule.field.split('.');
+        let index = parseInt(list[1]);
+        let max = parseInt(this.dialogData.maxList[index].maxNum);
+        if(value>max){
+          callback(new Error("超出该机柜可存放量"));
+        }else{
+          callback();
+        }
+      };
       return {
         //限制时间范围
         pickerBeginOption: {
@@ -254,7 +267,8 @@
           ],
           chemicalAmount:[
             { required: true, message: '请输入容器容量', trigger: 'blur' },
-            { required: true, message: "请输入容器容量", validator: this.spaceJudgment, trigger: "blur" }
+            { required: true, message: "请输入容器容量", validator: this.spaceJudgment, trigger: "blur" },
+            { required: true, message: "超出该机柜可存放量", validator: computingCapacity, trigger: "blur" },
           ],
           tare:[
             { required: true, message: '请输入容器自重', trigger: 'blur' },
@@ -413,7 +427,31 @@
                 list.push(obj);
               }
             }
-            this.$set(this.dialogData,"maxList",list);
+            let newObj = {
+              chemicalId:self.selectioned.id,
+              cabinetIds:"",
+            }
+            for(let i=0;i<list.length;i++){
+              if(i==0){
+                newObj.cabinetIds = list[i].cabinetId;
+              }else{
+                newObj.cabinetIds = newObj.cabinetIds +','+ list[i].cabinetId;
+              }
+            }
+            if(list[0]){
+              getRestStockByManyCabinet(newObj).then(response => {
+                for(let i=0;i<response.data.length;i++){
+                  for(let o=0;o<list.length;o++){
+                    if(response.data[i].cabinetId == list[o].cabinetId){
+                      list[o].maxNum = response.data[i].restStock;
+                    }
+                  }
+                }
+                this.$set(this.dialogData,"maxList",list);
+              })
+            }else{
+              this.$set(this.dialogData,"maxList",list);
+            }
           });
         }
       },
@@ -439,6 +477,10 @@
       handleAdd(){
         //查询当前院系
         filterDept().then(response => {
+          if(!this.selectioned.id){
+            this.msgError('请勾选化学品')
+            return
+          }
           let text = "";
           let idText = "";
           for(let i=0;i<response.data.length;i++){
@@ -515,9 +557,7 @@
         if (selection.length === 0) {
           // 判断selection是否有值存在
           this.selectioned = {};
-          return
-        }
-        if (row) {
+        }else{
           this.selectioned = row
           this.$refs.multipleTable.toggleRowSelection(row, true)
         }
@@ -575,12 +615,18 @@
           height: 16px;
         }
         p:nth-child(2){
+          flex:1;
           height: 16px;
           font-size: 16px;
           color: #333333;
           line-height: 16px;
           margin-left:12px;
         }
+        p:nth-child(3){
+          font-size:16px;
+          line-height: 16px;
+          color:#0183FA;
+        }
       }
       .for-big-box{
         margin-top:20px;

src/views/studentViews/chemicalManagement/studentChemicalInfo/index.vue

@@ -36,6 +36,7 @@
       </el-form>
       <el-table v-loading="loading" border :data="tableList">
         <el-table-column label="化学品编号" align="center" prop="joinNum" width="130px" show-overflow-tooltip/>
+        <el-table-column label="化学品名" align="center" prop="chemicalName" width="130px" show-overflow-tooltip/>
         <el-table-column label="容量规格" align="center" prop="chemicalAmountUnit" width="150px" show-overflow-tooltip/>
         <el-table-column label="容器规格" align="center" prop="tare" width="150px" show-overflow-tooltip/>
         <el-table-column label="过期时间" align="center" prop="expireTime" width="150px" show-overflow-tooltip>

src/views/studentViews/chemicalManagement/studentPurchaseRequisition/addPage.vue

@@ -0,0 +1,410 @@
+<!--新增-->
+<template>
+  <div class="addPage">
+    <div class="title-box">
+      <p>化学品申购</p>
+      <p class="reset-button-one" @click="backPage(1)"><i class="el-icon-arrow-left"></i>返回</p>
+    </div>
+    <div class="page-max-box scrollbar-box">
+      <el-form :model="formData" ref="form" :inline="true" :rules="rules">
+        <el-form-item label="申购原因：" prop="applyReason" label-width="100px">
+          <el-input
+            type="textarea"
+            resize="none"
+            maxLength="50"
+            :rows="4"
+            style="width:1200px;"
+            v-model="formData.applyReason"
+            placeholder="请输入申购原因"
+            clearable/>
+        </el-form-item>
+        <div class="two-form-flex">
+          <div class="two-form-left">
+            <el-form-item label="实验室：" prop="subId" label-width="100px">
+              <el-select
+                style="width:360px;"
+                v-model="formData.subId"
+                filterable
+                remote
+                clearable
+                reserve-keyword
+                @change="subChange"
+                @focus="selectFocus"
+                @clear="clearClick"
+                placeholder="请选择实验室"
+                :remote-method="getSelectList"
+                :loading="loading">
+                <el-option
+                  v-for="item in selectList"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </div>
+          <p class="two-form-right add-button-one-90" @click="backPage(2)">更换化学品</p>
+        </div>
+        <div class="form-list-max-box">
+          <div class="form-list-title-box">
+            <p>化学品名称</p>
+            <p>化学品柜</p>
+            <p>剩余可存放量</p>
+            <p>本次申购量</p>
+          </div>
+          <div class="form-list-data-box" v-for="(item,index) in formData.maxList" :key="index">
+            <div class="form-list-data-title">
+              <p>{{item.chemicalName}}</p>
+            </div>
+            <div class="form-list-data-for-max-box">
+              <div class="form-list-data-for" v-for="(minItem,minIndex) in item.list" :key="minIndex">
+                <div class="form-list-one-box">
+                  <el-form-item label="" :prop="'maxList.'+ index +'.list.'+ minIndex +'.cabinetId'"
+                                :rules="rules.cabinetId">
+                    <el-select v-model="minItem.cabinetId" clearable placeholder="请选择化学品柜"
+                      @change="(val)=>selectCabinet(index,minIndex,val)">
+                      <el-option v-for="item in cabinetLit"
+                                 :key="item.id" :value="item.id" :label="item.cabinetName"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </div>
+                <p class="form-list-text-p">
+                  {{minItem.applyText?minItem.applyText:'请选择化学品柜'}}
+                </p>
+                <div class="form-list-two-box">
+                  <el-form-item label="" :prop="'maxList.'+ index +'.list.'+ minIndex +'.applyNum'"
+                                :rules="rules.applyNum">
+                    <el-input
+                      maxLength="30"
+                      v-model="minItem.applyNum"
+                      placeholder="请输入本次申购量"
+                      clearable
+                      onkeyup="this.value=this.value.replace(/\D/g,'')"
+                      onafterpaste="this.value=this.value.replace(/\D/g,'')"
+                      style="width: 220px"
+                    ><i slot="append">g</i></el-input>
+                  </el-form-item>
+                  <p class="el-icon-delete button-icon-p" v-if="formData.maxList[index].list.length>1" @click="delObj(index,minIndex)"></p>
+                  <p class="el-icon-circle-plus-outline button-icon-p" v-if="minIndex ==formData.maxList[index].list.length-1" @click="addObj(index)"></p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bottom-button-box">
+          <p class="add-button-one-90 right-button" @click="upData(2)">保存草稿</p>
+          <p class="inquire-button-one right-button" @click="upData(1)">提交</p>
+        </div>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { getNoAdminSubjectListNopage,getCabinetBySubId,getRestStock,addHxpapply,getHxpapply } from "@/api/medicUniversity-3_1/index";
+  export default {
+    name: "addPage",
+    props:{
+      addPagePropsData:{},
+      multipleTableList:{},
+    },
+    data(){
+      return{
+        loading:false,
+        formData:{
+          subId:"",
+          applyReason:"",
+          maxList:[],
+        },
+        rules:{
+          applyReason:[
+            { required: true, message: '请输入申购原因', trigger: 'blur' },
+            { required: true, message: "请输入申购原因", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          subId:[
+            { required: true, message: '请选择实验室', trigger: 'blur' },
+            { required: true, message: "请选择实验室", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          cabinetId:[
+            { required: true, message: '请选择化学品柜', trigger: 'blur' },
+            { required: true, message: "请选择化学品柜", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          applyNum:[
+            { required: true, message: '请输入本次申购量', trigger: 'blur' },
+            { required: true, message: "请输入本次申购量", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+        },
+        //实验室列表
+        selectList:[],
+        //机柜列表
+        cabinetLit:[],
+      }
+    },
+    created() {
+
+    },
+    mounted(){
+      if(this.addPagePropsData.subjectId){
+        this.$set(this.formData,'subjectId',this.addPagePropsData.subjectId);
+      }
+      if(this.addPagePropsData.chemicalName){
+        this.$set(this.formData,'chemicalName',this.addPagePropsData.chemicalName);
+      }
+      this.getSubject();
+      this.addData();
+    },
+    methods: {
+      //新增逻辑
+      addData(){
+        let self = this;
+        for(let i=0;i<self.multipleTableList.length;i++){
+          let obj = {
+            chemicalId:self.multipleTableList[i].id,
+            chemicalName:self.multipleTableList[i].chemicalName,
+            list:[{cabinetId:"",applyNum:"",applyText:""}],
+          }
+          self.formData.maxList.push(obj);
+        }
+      },
+      //删除子项
+      delObj(index,minIndex){
+        this.formData.maxList[index].list.splice(minIndex,1)
+      },
+      //增加子项
+      addObj(index){
+        let obj = {cabinetId:"",applyNum:"",applyText:""}
+        this.formData.maxList[index].list.push(obj);
+      },
+      //提交
+      upData(type){
+        let self = this;
+        this.$refs["form"].validate((valid) => {
+          if (valid) {
+            let text = type==1?'提交':'保存';
+            this.$confirm('是否确认'+text+'?', "警告", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(function() {
+              let upObj = {
+                applyStatus:type,
+                subId:self.formData.subId,
+                applyReason:self.formData.applyReason,
+                actHxpapplyDetailList:[],
+              };
+              for(let i=0;i<self.formData.maxList.length;i++){
+                for(let o=0;o<self.formData.maxList[i].list.length;o++){
+                  let obj = {
+                    chemicalId: self.formData.maxList[i].chemicalId,
+                    chemicalName: self.formData.maxList[i].chemicalName,
+                    cabinetId: self.formData.maxList[i].list[o].cabinetId,
+                    applyNum: self.formData.maxList[i].list[o].applyNum
+                  }
+                  upObj.actHxpapplyDetailList.push(obj)
+                }
+              }
+              addHxpapply(upObj).then(response => {
+                self.msgSuccess(response.msg);
+                self.backPage(3)
+              });
+            }).then(() => {
+            }).catch(() => {});
+          }
+        })
+      },
+      //返回
+      backPage(type){
+        if(type == 1){
+          this.$parent.goPage(1);
+        }else if(type == 2){
+          let obj = {
+            type:true,
+            subjectId:this.formData.subjectId,
+            chemicalName:this.formData.chemicalName,
+          };
+          this.$parent.goPage(3,obj);
+        }else if(type == 3){
+          this.$parent.backPage();
+        }
+      },
+      // 机柜选中
+      selectCabinet(index,minIndex,val){
+        let obj = {
+          subId:this.formData.subId,
+          chemicalId:this.formData.maxList[index].chemicalId,
+          cabinetId:this.formData.maxList[index].list[minIndex].cabinetId,
+        };
+        getRestStock(obj).then(response => {
+          this.$set(this.formData.maxList[index].list[minIndex],'applyText',response.data.restStock);
+        });
+      },
+      // 实验室选中
+      subChange(val){
+        let self = this;
+        getCabinetBySubId({id:val}).then(response => {
+          this.$set(this,'cabinetLit',response.data);
+          for(let i=0;i<self.formData.maxList.length;i++){
+            for(let o=0;o<self.formData.maxList[i].list.length;o++){
+              console.log(self.formData.maxList[i].list[o])
+              this.$set(this.formData.maxList[i].list[o],'cabinetId',"");
+              this.$set(this.formData.maxList[i].list[o],'applyText',"");
+            }
+          }
+        });
+      },
+      getSubject(){
+        //查询院系下实验室
+        getNoAdminSubjectListNopage().then(response => {
+          //当前列表
+          this.selectList = JSON.parse(JSON.stringify(response.data));
+          //原始列表数据
+          this.selectListData = JSON.parse(JSON.stringify(response.data));
+        });
+      },
+      selectFocus(){
+        this.selectList = JSON.parse(JSON.stringify(this.selectListData));
+      },
+      /** 实验室-本地懒加载 */
+      getSelectList(val) {
+        let self = this;
+        let list = [];
+        for(let i=0;i<self.selectListData.length;i++){
+          if(self.selectListData[i].name.indexOf(val) != -1){
+            list.push(self.selectListData[i]);
+          }
+        }
+        this.selectList = JSON.parse(JSON.stringify(list))
+      },
+      //实验室选中清除
+      clearClick(){
+        this.selectList = JSON.parse(JSON.stringify(this.selectListData))
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .addPage{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    p{
+      margin:0;
+      padding:0;
+    }
+    .title-box{
+      display: flex;
+      height:90px;
+      border-bottom: 1px solid #D8D8D8;
+      p:nth-child(1){
+        flex:1;
+        font-size:16px;
+        line-height:90px;
+        margin-left:18px;
+        color:#0045AF;
+      }
+      p:nth-child(2){
+        margin:25px 25px 0 0;
+      }
+    }
+    .page-max-box{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      padding:20px 80px;
+      .two-form-flex{
+        display: flex;
+        .two-form-left{
+          flex:1;
+        }
+        .two-form-right{
+          width:130px;
+        }
+      }
+      .form-list-max-box{
+        .form-list-title-box{
+          display: flex;
+          background: #F5F5F5;
+          border-bottom:1px solid #e0e0e0;
+          p{
+            line-height:60px;
+            font-size:16px;
+            color:#333;
+          }
+          p:nth-child(1){
+            padding-left:58px;
+            width:255px;
+          }
+          p:nth-child(2){
+            width:469px;
+          }
+          p:nth-child(3){
+            width:252px;
+          }
+          p:nth-child(4){
+            flex:1;
+          }
+        }
+        .form-list-data-box{
+          display: flex;
+          border:1px solid #e0e0e0;
+          border-top:none;
+          padding-top:20px;
+          .form-list-data-title{
+            vertical-align:middle;
+            width:255px;
+            display: flex;
+            p{
+              height:40px;
+              line-height:40px;
+              align-self: center;
+              margin-top:-20px;
+              margin-left:58px;
+            }
+          }
+          .form-list-data-for-max-box{
+            .form-list-data-for{
+              display: flex;
+              .form-list-one-box{
+                width:469px;
+              }
+              .form-list-text-p{
+                width:252px;
+                line-height:40px;
+                font-size:14px;
+              }
+              .form-list-two-box{
+                flex:1;
+                .button-icon-p:nth-child(2){
+                  margin-left:80px;
+                }
+                .button-icon-p{
+                  color:#A2A2A2;
+                  width:40px;
+                  height:40px;
+                  line-height:40px;
+                  text-align: center;
+                  cursor: pointer;
+                  margin-left:20px;
+                }
+              }
+            }
+          }
+        }
+      }
+      .bottom-button-box{
+        display: flex;
+        width:260px;
+        margin:55px auto;
+        p:nth-child(1){
+          width:120px;
+          margin-right:20px;
+        }
+        p:nth-child(2){
+          width:120px;
+        }
+      }
+    }
+  }
+</style>

src/views/studentViews/chemicalManagement/studentPurchaseRequisition/editCheckPage.vue

@@ -0,0 +1,232 @@
+<!--申购-->
+<template>
+  <div class="editCheckPage">
+    <div class="editCheckPage-min">
+      <el-form :model="queryParamsData" class="form-box" ref="queryForm" :inline="true">
+        <el-form-item label="关键字" prop="searchValue">
+          <el-input
+            style="width:210px;"
+            maxLength="30"
+            v-model="queryParamsData.searchValue"
+            placeholder="化学品名/别名/CAS号"
+            clearable
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item label="化学品分类" prop="chemicalClassify">
+          <el-select v-model="queryParamsData.chemicalClassify" clearable placeholder="请选择化学品分类" style="width:180px;">
+            <el-option
+              v-for="item in optionsListOne"
+              :key="item.id"
+              :label="item.classifyName"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="属性" prop="classifyAttribute">
+          <el-select v-model="queryParamsData.classifyAttribute" clearable placeholder="请选择属性" style="width:180px;">
+            <el-option
+              v-for="item in optionsListTwo"
+              :key="item.dictValue"
+              :label="item.dictLabel"
+              :value="item.dictValue">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+          <p class="reset-button-one" @click="resetQuery">重置</p>
+        </el-form-item>
+        <el-form-item style="float: right;">
+          <el-col :span="1.5">
+            <p class="inquire-button-one"
+               @click="goPage"
+            >确定</p>
+          </el-col>
+        </el-form-item>
+        <el-form-item style="float: right;">
+          <el-col :span="1.5">
+            <p class="reset-button-one"
+               @click="backPage"
+            >返回</p>
+          </el-col>
+        </el-form-item>
+      </el-form>
+      <el-table  border :data="tableList" ref="multipleTable" @selection-change="handleSelectionChange" :row-key="getRowKeys">
+        <el-table-column type="selection" width="50" align="center" :reserve-selection="true"/>
+        <el-table-column label="ID" align="center" prop="chemicalNum" show-overflow-tooltip/>
+        <el-table-column label="化学品名" align="center" prop="chemicalName" show-overflow-tooltip/>
+        <el-table-column label="CAS号" align="center" prop="casNum" show-overflow-tooltip/>
+        <el-table-column label="分类" align="center" prop="classifyName" show-overflow-tooltip/>
+        <el-table-column label="属性" align="center" prop="classifyAttribute" show-overflow-tooltip/>
+        <el-table-column label="形态" align="center" prop="chemicalShapeInfo" show-overflow-tooltip/>
+        <el-table-column label="纯度" align="center" prop="purity" show-overflow-tooltip/>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page-sizes="[20, 30, 40, 50]"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+  import { hxpChemicalList,classifyList } from "@/api/medicUniversity-3_1/index";
+  import addPage from "./addPage.vue"
+  export default {
+    name: "editCheckPage",
+    components: {
+      addPage,
+    },
+    props:{
+      editCheckIds:{},
+    },
+    data(){
+      return{
+        // 遮罩层
+        loading:false,
+        // 分类
+        optionsListOne:[],
+        // 属性
+        optionsListTwo:[],
+        // 创建时间
+        dateRange:[],
+        // 搜索数据
+        queryParamsData:{
+          pageNum:1,
+          pageSize:20,
+        },
+        // 搜索实际发送数据
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+        },
+        //数据数量
+        total:0,
+        //数据数组
+        tableList:[],
+        // 选中用户组
+        userIds: [],
+        // 非多个禁用
+        multiple: true,
+        //表格扩展选择器---需要在@selection-change绑定的方法内监控selection数组长度
+        selectedNum:0,
+        //新增页参数
+        addPagePropsData:{},
+        //勾选数据
+        multipleTableList:[],
+        //编辑参数
+        editPropsData:{},
+      }
+    },
+    created() {
+
+    },
+    mounted(){
+      this.getDicts("hxp_classifyattribute").then(response => {
+        this.optionsListTwo = response.data;
+      })
+      this.classifyList();
+      this.getListOne();
+    },
+    methods: {
+      //确定申购
+      goPage(){
+        if(!this.multipleTableList[0]){
+          this.msgError("请勾选化学品")
+          return
+        }
+        this.$parent.pageToggle(3,this.multipleTableList);
+      },
+      //获取数据列表
+      getListOne(){
+        let self = this;
+        let obj = {
+          ids:this.editCheckIds.ids,
+          pageNum:1,
+          pageSize:100,
+        };
+        hxpChemicalList(obj).then(data => {
+          for(let i=0;i<data.rows.length;i++){
+            self.$refs.multipleTable.toggleRowSelection(data.rows[i],true)
+          }
+          setTimeout(function(){
+            self.getList();
+          },100);
+        });
+      },
+      getList(){
+        let self = this;
+        this.queryParamsData = JSON.parse(JSON.stringify(this.queryParams));
+        hxpChemicalList(this.queryParamsData).then(response => {
+          this.total = response.total;
+          this.tableList = response.rows;
+        });
+      },
+      //获取化学品分类列表
+      classifyList(){
+        classifyList().then(response => {
+          this.optionsListOne = response.rows;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParamsData.pageNum = 1;
+        this.queryParamsData.pageSize = 20;
+        this.queryParams = JSON.parse(JSON.stringify(this.queryParamsData));
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'queryParamsData',{});
+        this.$set(this,'queryParams',{});
+        this.handleQuery();
+      },
+      //返回
+      backPage(){
+        this.$parent.pageToggle(1);
+      },
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.userIds = selection.map(item => item.id)
+        this.$set(this,'multipleTableList',selection);
+        this.multiple = !selection.length
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .editCheckPage{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    p{
+      margin:0;
+      padding:0;
+    }
+    .editCheckPage-min{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      padding:20px;
+      .button-box{
+        display: flex;
+      }
+    }
+  }
+</style>

src/views/studentViews/chemicalManagement/studentPurchaseRequisition/editPage.vue

@@ -0,0 +1,453 @@
+<!--编辑-->
+<template>
+  <div class="editPage">
+    <div class="editPage-min" v-if="pageType == 1">
+      <div class="title-box">
+        <p>化学品申购</p>
+        <p class="reset-button-one" @click="backPage"><i class="el-icon-arrow-left"></i>返回</p>
+      </div>
+      <div class="page-max-box scrollbar-box">
+        <el-form :model="formData" ref="form" :inline="true" :rules="rules">
+          <el-form-item label="申购原因：" prop="applyReason" label-width="100px">
+            <el-input
+              type="textarea"
+              resize="none"
+              maxLength="50"
+              :rows="4"
+              style="width:1200px;"
+              v-model="formData.applyReason"
+              placeholder="请输入申购原因"
+              clearable/>
+          </el-form-item>
+          <div class="two-form-flex">
+            <div class="two-form-left">
+              <el-form-item label="实验室：" prop="subId" label-width="100px">
+                <el-select
+                  style="width:360px;"
+                  v-model="formData.subId"
+                  filterable
+                  remote
+                  clearable
+                  reserve-keyword
+                  @change="subChange"
+                  @focus="selectFocus"
+                  @clear="clearClick"
+                  placeholder="请选择实验室"
+                  :remote-method="getSelectList"
+                  :loading="loading">
+                  <el-option
+                    v-for="item in selectList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </div>
+            <p class="two-form-right add-button-one-90" @click="pageToggle(2)">更换化学品</p>
+          </div>
+          <div class="form-list-max-box">
+            <div class="form-list-title-box">
+              <p>化学品名称</p>
+              <p>化学品柜</p>
+              <p>剩余可存放量</p>
+              <p>本次申购量</p>
+            </div>
+            <div class="form-list-data-box" v-for="(item,index) in formData.maxList" :key="index">
+              <div class="form-list-data-title">
+                <p>{{item.chemicalName}}</p>
+              </div>
+              <div class="form-list-data-for-max-box">
+                <div class="form-list-data-for" v-for="(minItem,minIndex) in item.list" :key="minIndex">
+                  <div class="form-list-one-box">
+                    <el-form-item label="" :prop="'maxList.'+ index +'.list.'+ minIndex +'.cabinetId'"
+                                  :rules="rules.cabinetId">
+                      <el-select v-model="minItem.cabinetId" clearable placeholder="请选择化学品柜"
+                                 @change="(val)=>selectCabinet(index,minIndex,val)">
+                        <el-option v-for="item in cabinetLit"
+                                   :key="item.id" :value="item.id" :label="item.cabinetName"></el-option>
+                      </el-select>
+                    </el-form-item>
+                  </div>
+                  <p class="form-list-text-p">
+                    {{minItem.applyText?minItem.applyText:'请选择化学品柜'}}
+                  </p>
+                  <div class="form-list-two-box">
+                    <el-form-item label="" :prop="'maxList.'+ index +'.list.'+ minIndex +'.applyNum'"
+                                  :rules="rules.applyNum">
+                      <el-input
+                        maxLength="30"
+                        v-model="minItem.applyNum"
+                        placeholder="请输入本次申购量"
+                        clearable
+                        onkeyup="this.value=this.value.replace(/\D/g,'')"
+                        onafterpaste="this.value=this.value.replace(/\D/g,'')"
+                        style="width: 220px"
+                      ><i slot="append">g</i></el-input>
+                    </el-form-item>
+                    <p class="el-icon-delete button-icon-p" v-if="formData.maxList[index].list.length>1" @click="delObj(index,minIndex)"></p>
+                    <p class="el-icon-circle-plus-outline button-icon-p" v-if="minIndex ==formData.maxList[index].list.length-1" @click="addObj(index)"></p>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="bottom-button-box">
+            <p class="add-button-one-90 right-button" @click="upData(2)">保存草稿</p>
+            <p class="inquire-button-one right-button" @click="upData(1)">提交</p>
+          </div>
+        </el-form>
+      </div>
+    </div>
+    <edit-check-page :editCheckIds="editCheckIds" v-if="pageType == 2"></edit-check-page>
+  </div>
+</template>
+
+<script>
+  import editCheckPage from "./editCheckPage.vue"
+  import { getNoAdminSubjectListNopage,getCabinetBySubId,getRestStock,addHxpapply,getHxpapply } from "@/api/medicUniversity-3_1/index";
+  export default {
+    name: "editPage",
+    components: {
+      editCheckPage
+    },
+    props:{
+      editPagePropsData:{},
+    },
+    data(){
+      return{
+        pageType:1,
+        loading:false,
+        formData:{
+          subId:"",
+          applyReason:"",
+          maxList:[],
+        },
+        rules:{
+          applyReason:[
+            { required: true, message: '请输入申购原因', trigger: 'blur' },
+            { required: true, message: "请输入申购原因", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          subId:[
+            { required: true, message: '请选择实验室', trigger: 'blur' },
+            { required: true, message: "请选择实验室", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          cabinetId:[
+            { required: true, message: '请选择化学品柜', trigger: 'blur' },
+            { required: true, message: "请选择化学品柜", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          applyNum:[
+            { required: true, message: '请输入本次申购量', trigger: 'blur' },
+            { required: true, message: "请输入本次申购量", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+        },
+        //实验室列表
+        selectList:[],
+        //机柜列表
+        cabinetLit:[],
+        //当前选中化学品(用于下级页面)
+        editCheckIds:{},
+      }
+    },
+    created() {
+
+    },
+    mounted(){
+      this.editData();
+    },
+    methods: {
+      //去选择页面
+      pageToggle(type,data){
+        let self = this;
+        if(type == 1){
+          this.pageType = 1;
+        }else if(type == 2){
+          let text = "";
+          for(let i=0;i<self.formData.maxList.length;i++){
+            if(i == 0){
+              text = self.formData.maxList[i].chemicalId
+            }else{
+              text = text + ',' +self.formData.maxList[i].chemicalId
+            }
+          }
+          this.$set(this.editCheckIds,'ids',text);
+          this.pageType = 2;
+        }else if(type == 3){
+          let newList = [];
+          for(let i=0;i<self.formData.maxList.length;i++){
+            for(let o=0;o<data.length;o++){
+              if(self.formData.maxList[i].chemicalId == data[o].id){
+                newList.push(self.formData.maxList[i]);
+              }
+            }
+          }
+          newList = JSON.parse(JSON.stringify(newList));
+          this.$set(this.formData,'maxList',newList);
+          for(let i=0;i<data.length;i++){
+            let num = 0;
+            for(let o=0;o<self.formData.maxList.length;o++){
+              if(self.formData.maxList[o].chemicalId == data[i].id){
+                num++
+              }
+            }
+            if(num == 0){
+              let obj = {
+                chemicalId:data[i].id,
+                chemicalName:data[i].chemicalName,
+                list:[{cabinetId:"",applyNum:"",applyText:""}],
+              }
+              self.formData.maxList.push(obj);
+            }
+          }
+          this.pageType = 1;
+        }
+      },
+      //新增逻辑
+      editData(){
+        this.$set(this,'formData',this.editPagePropsData);
+        this.getSubject();
+        this.getCabinet(this.editPagePropsData.subId);
+      },
+      //删除子项
+      delObj(index,minIndex){
+        this.formData.maxList[index].list.splice(minIndex,1)
+      },
+      //增加子项
+      addObj(index){
+        let obj = {cabinetId:"",applyNum:"",applyText:""}
+        this.formData.maxList[index].list.push(obj);
+      },
+      //提交
+      upData(type){
+        let self = this;
+        this.$refs["form"].validate((valid) => {
+          if (valid) {
+            let text = type==1?'提交':'保存';
+            this.$confirm('是否确认'+text+'?', "警告", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(function() {
+              let upObj = {
+                id:self.formData.id,
+                applyStatus:type,
+                subId:self.formData.subId,
+                applyReason:self.formData.applyReason,
+                actHxpapplyDetailList:[],
+              };
+              for(let i=0;i<self.formData.maxList.length;i++){
+                for(let o=0;o<self.formData.maxList[i].list.length;o++){
+                  let obj = {
+                    chemicalId: self.formData.maxList[i].chemicalId,
+                    chemicalName: self.formData.maxList[i].chemicalName,
+                    cabinetId: self.formData.maxList[i].list[o].cabinetId,
+                    applyNum: self.formData.maxList[i].list[o].applyNum
+                  }
+                  upObj.actHxpapplyDetailList.push(obj)
+                }
+              }
+              addHxpapply(upObj).then(response => {
+                self.msgSuccess(response.msg);
+                self.backPage();
+              });
+            }).then(() => {
+            }).catch(() => {});
+          }
+        })
+      },
+      //返回
+      backPage(){
+        this.$parent.pageToggle(1);
+      },
+      // 机柜选中
+      selectCabinet(index,minIndex,val){
+        let obj = {
+          subId:this.formData.subId,
+          chemicalId:this.formData.maxList[index].chemicalId,
+          cabinetId:this.formData.maxList[index].list[minIndex].cabinetId,
+        };
+        getRestStock(obj).then(response => {
+          this.$set(this.formData.maxList[index].list[minIndex],'applyText',response.data.restStock);
+        });
+      },
+      // 实验室选中
+      subChange(val){
+        let self = this;
+        getCabinetBySubId({id:val}).then(response => {
+          this.$set(this,'cabinetLit',response.data);
+          for(let i=0;i<self.formData.maxList.length;i++){
+            for(let o=0;o<self.formData.maxList[i].list.length;o++){
+              console.log(self.formData.maxList[i].list[o])
+              this.$set(this.formData.maxList[i].list[o],'cabinetId',"");
+              this.$set(this.formData.maxList[i].list[o],'applyText',"");
+            }
+          }
+        });
+      },
+      getSubject(){
+        //查询院系下实验室
+        getNoAdminSubjectListNopage().then(response => {
+          //当前列表
+          this.selectList = JSON.parse(JSON.stringify(response.data));
+          //原始列表数据
+          this.selectListData = JSON.parse(JSON.stringify(response.data));
+        });
+      },
+      getCabinet(val){
+        getCabinetBySubId({id:val}).then(response => {
+          this.$set(this,'cabinetLit',response.data);
+        });
+      },
+      selectFocus(){
+        this.selectList = JSON.parse(JSON.stringify(this.selectListData));
+      },
+      /** 实验室-本地懒加载 */
+      getSelectList(val) {
+        let self = this;
+        let list = [];
+        for(let i=0;i<self.selectListData.length;i++){
+          if(self.selectListData[i].name.indexOf(val) != -1){
+            list.push(self.selectListData[i]);
+          }
+        }
+        this.selectList = JSON.parse(JSON.stringify(list))
+      },
+      //实验室选中清除
+      clearClick(){
+        this.selectList = JSON.parse(JSON.stringify(this.selectListData))
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .editPage{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    .editPage-min{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      p{
+        margin:0;
+        padding:0;
+      }
+      .title-box{
+        display: flex;
+        height:90px;
+        border-bottom: 1px solid #D8D8D8;
+        p:nth-child(1){
+          flex:1;
+          font-size:16px;
+          line-height:90px;
+          margin-left:18px;
+          color:#0045AF;
+        }
+        p:nth-child(2){
+          margin:25px 25px 0 0;
+        }
+      }
+      .page-max-box{
+        flex:1;
+        display: flex;
+        flex-direction: column;
+        padding:20px 80px;
+        .two-form-flex{
+          display: flex;
+          .two-form-left{
+            flex:1;
+          }
+          .two-form-right{
+            width:130px;
+          }
+        }
+        .form-list-max-box{
+          .form-list-title-box{
+            display: flex;
+            background: #F5F5F5;
+            border-bottom:1px solid #e0e0e0;
+            p{
+              line-height:60px;
+              font-size:16px;
+              color:#333;
+            }
+            p:nth-child(1){
+              padding-left:58px;
+              width:255px;
+            }
+            p:nth-child(2){
+              width:469px;
+            }
+            p:nth-child(3){
+              width:252px;
+            }
+            p:nth-child(4){
+              flex:1;
+            }
+          }
+          .form-list-data-box{
+            display: flex;
+            border:1px solid #e0e0e0;
+            border-top:none;
+            padding-top:20px;
+            .form-list-data-title{
+              vertical-align:middle;
+              width:255px;
+              display: flex;
+              p{
+                height:40px;
+                line-height:40px;
+                align-self: center;
+                margin-top:-20px;
+                margin-left:58px;
+              }
+            }
+            .form-list-data-for-max-box{
+              .form-list-data-for{
+                display: flex;
+                .form-list-one-box{
+                  width:469px;
+                }
+                .form-list-text-p{
+                  width:252px;
+                  line-height:40px;
+                  font-size:14px;
+                }
+                .form-list-two-box{
+                  flex:1;
+                  .button-icon-p:nth-child(2){
+                    margin-left:80px;
+                  }
+                  .button-icon-p{
+                    color:#A2A2A2;
+                    width:40px;
+                    height:40px;
+                    line-height:40px;
+                    text-align: center;
+                    cursor: pointer;
+                    margin-left:20px;
+                  }
+                }
+              }
+            }
+          }
+        }
+        .bottom-button-box{
+          display: flex;
+          width:260px;
+          margin:55px auto;
+          p:nth-child(1){
+            width:120px;
+            margin-right:20px;
+          }
+          p:nth-child(2){
+            width:120px;
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/studentViews/chemicalManagement/studentPurchaseRequisition/index.vue

@@ -95,10 +95,10 @@
           <el-table-column label="操作" align="center" prop="createTime" width="230px">
             <template slot-scope="scope">
               <div class="button-box">
-                <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3" style="margin-right:10px;" @click="pageToggle(4)">编辑</p>
-                <p class="table-min-button" v-show="scope.row.approvalStatus == 1 && !scope.row.lsName" style="margin-right:10px;" @click="pageToggle(4)">撤销</p>
-                <p class="table-min-button" style="margin-right:10px;" @click="pageToggle(4)">审批单</p>
-                <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3">删除</p>
+                <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3" style="margin-right:10px;" @click="pageToggle(5,scope.row)">编辑</p>
+                <p class="table-min-button" v-show="scope.row.approvalStatus == 1 && !scope.row.lsName" style="margin-right:10px;" @click="approvalRevoke(scope.row)">撤销</p>
+                <p class="table-min-button" style="margin-right:10px;" @click="pageToggle(7,scope.row)">审批单</p>
+                <p class="table-min-button" v-show="scope.row.approvalStatus == 2 || scope.row.approvalStatus == 3" @click="delHxpapply(scope.row)">删除</p>
               </div>
             </template>
           </el-table-column>
@@ -113,19 +113,32 @@
       </div>
     </div>
     <draft-Page v-if="pageType == 2"></draft-Page>
+    <list-Page :listPagePropsData="listPagePropsData" v-if="pageType == 3"></list-Page>
+    <approval-page :approvalPagePropsData="approvalPagePropsData" v-if="pageType == 4"></approval-page>
+    <edit-page :editPagePropsData="editPagePropsData" v-if="pageType == 5"></edit-page>
   </div>
 </template>
 
 <script>
-  import { getHxpapplyMyList } from "@/api/studentApi/chemicalManagement/index";
+  import { getHxpapplyMyList,getHxpapply,approvalRevoke,delHxpapply } from "@/api/studentApi/chemicalManagement/index";
   import draftPage from "./draftPage.vue"
+  import listPage from "./listPage.vue"
+  import approvalPage from "./approvalPage.vue"
+  import editPage from "./editPage.vue"
   export default {
     name: "index",
     components: {
       draftPage,
+      listPage,
+      approvalPage,
+      editPage
     },
     data() {
       return {
+        // 传参数据
+        listPagePropsData:{},
+        approvalPagePropsData:{},
+        editPagePropsData:{},
         pageType:1,
         // 申请时间
         dateRangeOne:[],
@@ -153,17 +166,111 @@
       this.getList();
     },
     methods: {
-      pageToggle(type){
+      //操作
+      pageToggle(type,row){
         if(type == 1){
+          //返回列表重置搜索项
           this.pageType = 1;
+          this.resetQuery();
         }else if(type == 2){
+          //去草稿箱
           this.pageType = 2
         }else if(type == 3){
+          //新增-去选择列表
           this.pageType = 3
         }else if(type == 4){
+          //查看详情
           this.pageType = 4
+        }else if(type == 5){
+          //编辑
+          getHxpapply(row.id).then(response => {
+            let maxObj = {
+              id:row.id,
+              subId:parseInt(response.data.subId),
+              applyReason:response.data.applyReason,
+              maxList:[],
+            }
+            for(let i=0;i<response.data.actHxpapplyDetailList.length;i++){
+              let num = 0;
+              for(let o=0;o<maxObj.maxList.length;o++){
+                if(maxObj.maxList[o].chemicalId == response.data.actHxpapplyDetailList[i].chemicalId){
+                  num++
+                }
+              }
+              if(num == 0){
+                let obj = {
+                  chemicalId:parseInt(response.data.actHxpapplyDetailList[i].chemicalId),
+                  chemicalName:response.data.actHxpapplyDetailList[i].chemicalName,
+                  list:[],
+                }
+                maxObj.maxList.push(obj);
+              }
+            }
+            for(let i=0;i<response.data.actHxpapplyDetailList.length;i++){
+              for(let o=0;o<maxObj.maxList.length;o++){
+                if(maxObj.maxList[o].chemicalId == response.data.actHxpapplyDetailList[i].chemicalId){
+                  let minObj = {
+                    cabinetId:parseInt(response.data.actHxpapplyDetailList[i].cabinetId),
+                    applyNum:parseInt(response.data.actHxpapplyDetailList[i].applyNum),
+                    applyText:response.data.actHxpapplyDetailList[i].remainingStorage,
+                  };
+                  maxObj.maxList[o].list.push(minObj);
+                }
+              }
+            }
+            this.$set(this,'editPagePropsData',maxObj);
+            this.pageType = 5;
+          });
+        }else if(type == 6){
+          //审批
+          let obj = {
+            id:row.id,
+            type:1,
+            userType:row.userType
+          };
+          this.$set(this,'approvalPagePropsData',obj);
+          this.pageType = 4;
+        }else if(type == 7){
+          //审批单
+          let obj = {
+            id:row.id,
+            type:2,
+            userType:row.userType
+          };
+          this.$set(this,'approvalPagePropsData',obj);
+          this.pageType = 4;
         }
       },
+      //撤销
+      approvalRevoke(row){
+        let self = this;
+        this.$confirm('是否确认撤销?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          approvalRevoke({taskId:row.id}).then(response => {
+            self.msgSuccess(response.msg);
+            self.resetQuery();
+          });
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //删除
+      delHxpapply(row){
+        let self = this;
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          delHxpapply(row.id).then(response => {
+            self.msgSuccess(response.msg);
+            self.resetQuery();
+          });
+        }).then(() => {
+        }).catch(() => {});
+      },
       //获取数据列表
       getList(){
         this.queryParamsData = JSON.parse(JSON.stringify(this.queryParams));

src/views/studentViews/chemicalManagement/studentPurchaseRequisition/listPage.vue

@@ -0,0 +1,229 @@
+<!--申购-->
+<template>
+  <div class="listPage">
+    <div class="listPage-min" v-show="pageType == 1">
+      <el-form :model="queryParamsData" class="form-box" ref="queryForm" :inline="true">
+        <el-form-item label="关键字" prop="searchValue">
+          <el-input
+            style="width:210px;"
+            maxLength="30"
+            v-model="queryParamsData.searchValue"
+            placeholder="化学品名/别名/CAS号"
+            clearable
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item label="化学品分类" prop="chemicalClassify">
+          <el-select v-model="queryParamsData.chemicalClassify" clearable placeholder="请选择化学品分类" style="width:180px;">
+            <el-option
+              v-for="item in optionsListOne"
+              :key="item.id"
+              :label="item.classifyName"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="属性" prop="classifyAttribute">
+          <el-select v-model="queryParamsData.classifyAttribute" clearable placeholder="请选择属性" style="width:180px;">
+            <el-option
+              v-for="item in optionsListTwo"
+              :key="item.dictValue"
+              :label="item.dictLabel"
+              :value="item.dictValue">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+          <p class="reset-button-one" @click="resetQuery">重置</p>
+        </el-form-item>
+        <el-form-item style="float: right;">
+          <el-col :span="1.5">
+            <p class="inquire-button-one"
+               @click="goPage(2)"
+            >确定</p>
+          </el-col>
+        </el-form-item>
+        <el-form-item style="float: right;">
+          <el-col :span="1.5">
+            <p class="reset-button-one"
+               @click="backPage"
+            >返回</p>
+          </el-col>
+        </el-form-item>
+      </el-form>
+      <el-table  border :data="tableList" ref="multipleTable" @selection-change="handleSelectionChange" :row-key="getRowKeys">
+        <el-table-column type="selection" width="50" align="center" :reserve-selection="true"/>
+        <el-table-column label="ID" align="center" prop="chemicalNum" show-overflow-tooltip/>
+        <el-table-column label="化学品名" align="center" prop="chemicalName" show-overflow-tooltip/>
+        <el-table-column label="CAS号" align="center" prop="casNum" show-overflow-tooltip/>
+        <el-table-column label="分类" align="center" prop="classifyName" show-overflow-tooltip/>
+        <el-table-column label="属性" align="center" prop="classifyAttribute" show-overflow-tooltip/>
+        <el-table-column label="形态" align="center" prop="chemicalShapeInfo" show-overflow-tooltip/>
+        <el-table-column label="纯度" align="center" prop="purity" show-overflow-tooltip/>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page-sizes="[20, 30, 40, 50]"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+    <add-page :addPagePropsData="addPagePropsData"
+              :multipleTableList="multipleTableList"
+              :editPropsData="editPropsData"
+              v-if="pageType == 2"></add-page>
+  </div>
+</template>
+
+<script>
+  import { hxpChemicalList,classifyList } from "@/api/medicUniversity-3_1/index";
+  import addPage from "./addPage.vue"
+  export default {
+    name: "listPage",
+    components: {
+      addPage,
+    },
+    data(){
+      return{
+        // 遮罩层
+        loading:false,
+        //页面状态
+        pageType:1,
+        // 分类
+        optionsListOne:[],
+        // 属性
+        optionsListTwo:[],
+        // 创建时间
+        dateRange:[],
+        // 搜索数据
+        queryParamsData:{
+          pageNum:1,
+          pageSize:20,
+        },
+        // 搜索实际发送数据
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+        },
+        //数据数量
+        total:0,
+        //数据数组
+        tableList:[],
+        // 选中用户组
+        userIds: [],
+        // 非多个禁用
+        multiple: true,
+        //表格扩展选择器---需要在@selection-change绑定的方法内监控selection数组长度
+        selectedNum:0,
+        //新增页参数
+        addPagePropsData:{},
+        //勾选数据
+        multipleTableList:[],
+        //编辑参数
+        editPropsData:{},
+      }
+    },
+    created() {
+
+    },
+    mounted(){
+      this.getDicts("hxp_classifyattribute").then(response => {
+        this.optionsListTwo = response.data;
+      })
+      this.classifyList();
+      this.getList();
+    },
+    methods: {
+      //确定申购
+      goPage(type,data){
+        let self = this;
+        if(type==1){
+          this.pageType = 1;
+          this.$set(this,'addPagePropsData',{});
+          this.$set(this,'multipleTableList',[]);
+          this.$refs.multipleTable.clearSelection()
+        }else if(type == 2){
+          if(!this.multipleTableList[0]){
+            this.msgError("请勾选化学品")
+            return
+          }
+          this.pageType = 2;
+        }else if(type == 3){
+          this.$set(this,'addPagePropsData',JSON.parse(JSON.stringify(data)));
+          this.pageType = 1;
+        }
+      },
+      //获取数据列表
+      getList(){
+        this.queryParamsData = JSON.parse(JSON.stringify(this.queryParams));
+        hxpChemicalList(this.queryParamsData).then(response => {
+          this.total = response.total;
+          this.tableList = response.rows;
+        });
+      },
+      //获取化学品分类列表
+      classifyList(){
+        classifyList().then(response => {
+          this.optionsListOne = response.rows;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParamsData.pageNum = 1;
+        this.queryParamsData.pageSize = 20;
+        this.queryParams = JSON.parse(JSON.stringify(this.queryParamsData));
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'queryParamsData',{});
+        this.$set(this,'queryParams',{});
+        this.handleQuery();
+      },
+      //返回
+      backPage(){
+        this.$parent.pageToggle(1);
+      },
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.userIds = selection.map(item => item.id)
+        this.$set(this,'multipleTableList',selection);
+        this.multiple = !selection.length
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .listPage{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    p{
+      margin:0;
+      padding:0;
+    }
+    .listPage-min{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      padding:20px;
+      .button-box{
+        display: flex;
+      }
+    }
+  }
+</style>