heyang

src/api/chemicalManage/index.js

@@ -1 +1,9 @@
 import request from '@/utils/request'
+//审批流程查询
+export function getConfigList(data) {
+  return request({
+    url: '/chemical/auditconfig/getConfigList',
+    method: 'get',
+    params: data
+  })
+}

src/views/chemicalManage/purchaseManage/examineProcess/index.vue

@@ -0,0 +1,811 @@
+<!--审核流程-->
+<template>
+  <div class="app-container examineProcess">
+    <div class="page-container examineProcess-page" v-if="pageType == 1">
+        <div class="examineProcess-l">
+          <div class="examineProcess-l-t">审核流程配置</div>
+          <div class="examineProcess-l-b">
+            <p class="examine-selected">申购审核流程</p>
+            <p>申购审核流程</p>
+          </div>
+        </div>
+        <div class="examineProcess-r">
+            <div class="examineProcess-r-t">
+              <p class="btn-selected">管制类</p>
+              <p>非管制类</p>
+            </div>
+            <div class="examineProcess-r-b scrollbar-box">
+               <div class="process-max-box">
+                  <div class="process-big-box">
+                    <div class="process-text-box">
+                      <img src="@/assets/ZDimages/chemicalManage/icon_splc_fqr.png">
+                      <p>发起人</p>
+                    </div>
+                    <p class="process-name-p">申购人</p>
+                    <div class="process-img-box">
+                      <img v-if="dataList[0]" class="process-img-bottom" src="@/assets/ZDimages/chemicalManage/img_splc_xyb.png">
+                      <img v-if="!dataList[0]" @click="listAddButton" class="process-add-button-img" src="@/assets/ZDimages/chemicalManage/icon_splc_tj.png">
+                    </div>
+                  </div>
+               </div>
+               <div class="process-max-box-for" :class="index==dataList.length-1?'process-max-box-for-over':''" v-for="(item,index) in dataList" :key="index">
+                <div class="process-big-box">
+                  <div class="process-text-box">
+                    <img src="@/assets/ZDimages/chemicalManage/icon_splc_fqr.png">
+                    <p>审批人</p>
+                    <i class="el-icon-close" @click="listDelButton(index)"></i>
+                  </div>
+                  <div class="process-name-box" @click="openDialogButton(index)">
+                    <p class="process-name-p">{{!item.actAudituserInfo[0]?'请选择审批人':(item.actAudituserInfo[0]&&!item.actAudituserInfo[1]?item.actAudituserInfo[0].nickName:(item.actAudituserInfo[1]?'已选择'+item.actAudituserInfo.length+'人':''))}}</p>
+                    <i class="el-icon-arrow-right"></i>
+                  </div>
+                  <div class="process-img-box">
+                    <img v-if="index!=dataList.length-1" class="process-img-bottom" src="@/assets/ZDimages/chemicalManage/img_splc_xyb.png">
+                    <img v-if="index==dataList.length-1" class="process-img-bottom" src="@/assets/ZDimages/chemicalManage/img_splc_lcjs.png">
+                    <img v-if="index==dataList.length-1&&dataList.length<5" @click="listAddButton" class="process-add-button-img" src="@/assets/ZDimages/chemicalManage/icon_splc_tj.png">
+                  </div>
+                  <p class="over-text-one" v-if="index==dataList.length-1">流程结束</p>
+                  <p class="over-text-two" v-if="index==dataList.length-1">审批不能超过5级</p>
+                </div>
+              </div>
+            </div>
+        </div>
+    </div>
+    <el-dialog title="选择人员" :visible.sync="userDialogType" :close-on-click-modal="false" v-if="userDialogType"
+               width="900px" append-to-body id="approvalProcess-dialog-box">
+      <div class="dialog-max-big-box">
+        <div class="dialog-left-max-big-box">
+          <p class="title-p">选择:</p>
+          <div class="big-box">
+            <!--input部分-->
+            <div class="input-box">
+              <input type="text" placeholder="搜索姓名或工号、身份"
+                     v-model="queryParamsData.searchValue">
+              <p class="el-icon-search" @click="handleQuery"></p>
+            </div>
+            <!--面包屑部分-->
+            <div class="title-list-box scrollbar-box">
+              <div class="title-for" v-for="(item,index) in titleList" :key="index" @click="titleClick(index)">
+                <span :class="index!=titleList.length-1?'spanColor':''">{{item.label}}</span>
+                <span v-if="index!=titleList.length-1" class="el-icon-arrow-right"></span>
+              </div>
+            </div>
+            <!--可滚动数据部分-->
+            <div class="list-max-box scrollbar-box">
+              <!--部门部分-->
+              <div class="dept-box" @click="deptClick(item)"
+                   v-for="(item,index) in deptList" :key="item.deptId">
+                <img src="@/assets/ZDimages/chemicalManage/icon-mc.png">
+                <p>{{item.label}}</p>
+                <img src="@/assets/ZDimages/chemicalManage/icon-mc-xj.png">
+                <p>下级</p>
+              </div>
+              <!--人员部分-->
+              <div class="user-box" v-for="(item,index) in userList" :key="index" @click="addObjButton(item)">
+                <img v-if="item.type" src="@/assets/ZDimages/basicsModules/icon_xzqx_xz.png">
+                <img v-if="!item.type" src="@/assets/ZDimages/basicsModules/icon_xzqx_zc.png">
+                <p>{{item.nickName}}</p>
+                <p>{{item.positionName}}</p>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="dialog-right-max-big-box">
+          <p class="title-p">已选:</p>
+          <div class="big-box scrollbar-box">
+            <div class="user-for-box" v-for="(item,index) in userDialogRightList.actAudituserInfo" :key="index">
+              <img v-if="item.avatar" :src="item.avatar">
+              <img v-if="!item.avatar" src="@/assets/ZDimages/basicsModules/tx_cion.png">
+              <p>{{item.nickName}}</p>
+              <p class="el-icon-circle-close" @click="delRightUser(index)"></p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="dialog-bottom-box">
+        <div class="pagination-box">
+          <pagination :page-sizes="[20, 30, 40, 50]"
+            v-show="total>0"
+            :total="total"
+            :pager-count="5"
+            layout="total, prev, pager, next"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getUserList()"
+          />
+        </div>
+        <div class="radio-box">
+          <el-radio-group v-model="userDialogRightList.auditType">
+            <el-radio :label="1" style="color:#999;">依次审批</el-radio>
+            <el-radio :label="2" style="color:#999;">或签</el-radio>
+          </el-radio-group>
+        </div>
+        <div class="text-box">选择不能超过10人</div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <p class="dialog-footer-null-p"></p>
+        <el-button @click="offDialog">取 消</el-button>
+        <el-button type="primary" @click="upDataButton">确 定</el-button>
+        <p class="dialog-footer-null-p"></p>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+  import { iotTypeList,iotTypeDetail,iotTypeAdd,iotTypeUpdate,iotTypeDelete } from "@/api/iotDevice";
+  //import infoPage from "./infoPage.vue"
+  import {getConfigList} from "@/api/chemicalManage/index";
+  import {listDepartments} from "@/api/commonality/noPermission";
+  export default {
+    name: 'index',
+    components: {
+      exportComponent,
+     // infoPage,
+
+    },
+    data(){
+      return{
+        loading:false,
+        pageType:1,
+        //流程数据
+        dataList:[],
+        //人员选择页面开关
+        userDialogType:false,
+        //选中流程的index
+        userDialogTypeIndex:null,
+        //窗口右侧已选中人员数据
+        userDialogRightList:{},
+        //面包屑数据
+        titleList:[],
+        //院系数据
+        deptList:[],
+        //人员数据
+        userList:[
+          {name:"柴云龙1",type:true,text:"安全责任人",id:1,},
+          {name:"柴云龙2",type:false,text:"安全责任人",id:2,},
+          {name:"柴云龙3",type:true,text:"安全责任人",id:3,},
+          {name:"柴云龙4",type:false,text:"安全责任人",id:4,},
+          {name:"柴云龙5",type:true,text:"安全责任人",id:5,},
+          {name:"柴云龙6",type:false,text:"安全责任人",id:6,},
+        ],
+        //查询数据
+        queryParamsData:{
+          pageNum:1,
+          pageSize:20,
+        },
+        // 搜索实际发送数据
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+        },
+        //数据数量
+        total:0,
+        deptId:"",
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getConfigList();
+    },
+    methods: {
+      //提交
+      submitForm(){
+        let self = this;
+        if(!this.dataList[0]){
+          this.msgError('至少添加一个审批流程')
+          return
+        }
+        self.$confirm('确认要提交吗?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          for(let i=0;i<self.dataList.length;i++){
+            if(!self.dataList[i].actAudituserInfo[0]){
+              self.msgError('第'+(i+1)+'个审批流程未添加人员')
+              return
+            }
+          }
+          let list = [];
+          for(let i=0;i<self.dataList.length;i++){
+            let bigObj = {
+              auditType:self.dataList[i].auditType,
+              actAudituser:[],
+            };
+            for(let o=0;o<self.dataList[i].actAudituserInfo.length;o++){
+              let obj = {
+                auditUserId:self.dataList[i].actAudituserInfo[o].userId,
+              };
+              bigObj.actAudituser.push(obj);
+            }
+            list.push(bigObj);
+          }
+          auditconfig(list).then(response => {
+            self.msgSuccess(response.msg);
+            self.getConfigList();
+          });
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //确认
+      upDataButton(){
+        this.dataList[this.userDialogTypeIndex] = JSON.parse(JSON.stringify(this.userDialogRightList));
+        this.userDialogType = false;
+      },
+      //关闭弹窗
+      offDialog(){
+        this.$set(this,'userDialogType',false);
+        this.$set(this.queryParamsData,'searchValue',"");
+        this.$set(this.queryParams,'nickName',"");
+        this.$set(this,'deptId',"");
+        this.$set(this,'userDialogRightList',[]);
+        this.$set(this,'userDialogTypeIndex',"");
+      },
+      // 查询设置
+      getConfigList(){
+        getConfigList().then(response => {
+          this.dataList = response.rows
+        });
+      },
+      //添加勾选人员
+      addObjButton(item){
+        if(!item.type){
+          if(this.userDialogRightList.actAudituserInfo.length<10){
+            this.userDialogRightList.actAudituserInfo.push(item);
+            this.checkDataProcess();
+          }else{
+            this.msgError('选择不能超过10人')
+          }
+        }
+      },
+      //删除选中人员
+      delRightUser(index){
+        this.userDialogRightList.actAudituserInfo.splice(index,1);
+        this.checkDataProcess();
+      },
+      // 勾选数据处理
+      checkDataProcess(){
+        let self = this;
+        for(let i=0;i<self.userList.length;i++){
+          let num = 0;
+          for(let o=0;o<self.userDialogRightList.actAudituserInfo.length;o++){
+            if(self.userList[i].userId == self.userDialogRightList.actAudituserInfo[o].userId){
+              num++
+            }
+          }
+          self.userList[i].type = num != 0;
+        }
+        self.$forceUpdate();
+      },
+      //面包屑点击事件
+      titleClick(index){
+        let self = this;
+        this.getCatalogListOne(this.titleList[index].id);
+        this.$set(this.queryParams,'pageNum',1);
+        this.$set(this,'deptId',this.titleList[index].id);
+        this.getUserList();
+        let list = [];
+        let data = JSON.parse(JSON.stringify(self.titleList))
+        for(let i=index;i>=0;i--){
+          list.unshift(data[i]);
+        }
+        this.$set(this,'titleList',list);
+      },
+      // 目录点击事件
+      deptClick(item){
+        this.titleList.push(item);
+        this.getCatalogListOne(item.id);
+        this.$set(this.queryParams,'pageNum',1);
+        this.$set(this,'deptId',item.id);
+        this.getUserList();
+      },
+      // 查询目录
+      getCatalogListOne(id){
+        treeselect({parentId:id}).then(response => {
+          this.deptList = response.data;
+        });
+      },
+      // 查询目录初始化
+      getCatalogList(id){
+        treeselect({parentId:id}).then(response => {
+          this.deptList = response.data[0].children;
+          this.$set(this,'titleList',[response.data[0]]);
+        });
+      },
+      // 查询人员列表
+      getUserList(){
+        this.queryParamsData = JSON.parse(JSON.stringify(this.queryParams));
+        this.queryParamsData.deptId = this.deptId;
+        listUser(this.queryParamsData).then(response => {
+          this.userList = response.rows;
+          this.total = response.total;
+          this.checkDataProcess();
+        });
+      },
+      handleQuery() {
+        this.$set(this.queryParamsData,'pageNum',1);
+        this.queryParams = JSON.parse(JSON.stringify(this.queryParamsData));
+        this.getUserList();
+      },
+      // 编辑人员页面开启
+      openDialogButton(index){
+        let self = this;
+        this.$set(this.queryParamsData,'searchValue',"");
+        this.$set(this.queryParams,'nickName',"");
+        this.$set(this,'deptId',"");
+        this.getCatalogList("");
+        this.getUserList("");
+        this.$set(this,'userDialogRightList',JSON.parse(JSON.stringify(this.dataList[index])));
+        this.$set(this,'userDialogTypeIndex',index);
+        this.$set(this,'userDialogType',true);
+      },
+      //添加流
+      listAddButton(){
+        let obj = {
+          actAudituser:[],
+          actAudituserInfo:[],
+          auditType:1,
+        };
+        this.dataList.push(obj);
+      },
+      //删除流
+      listDelButton(index){
+        let self = this;
+        this.$confirm('是否确认删除该流程?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          self.dataList.splice(index,1);
+        }).then(() => {
+        }).catch(() => {});
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+
+.examineProcess{
+  .examineProcess-page{
+    display: flex;
+    justify-content: space-between;
+    flex-direction: row;
+    .examineProcess-l{
+      width: 270px;
+      height: 100%;
+      border-right: 1px solid  #E0E0E0;
+      .examineProcess-l-t{
+        font-size: 18px;
+        font-family: Microsoft YaHei, Microsoft YaHei;
+        font-weight: 400;
+        color: #0045AF;
+        line-height: 86px;
+        border-bottom: 1px solid  #E0E0E0;
+        text-align: center;
+      }
+      .examineProcess-l-b{
+        padding: 32px 0 0 34px;
+        box-sizing: border-box;
+        >p{
+          width: 200px;
+          height: 60px;
+          border-radius: 4px 4px 4px 4px;
+          opacity: 1;
+          border: 1px solid #E0E0E0;
+          font-size: 16px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #333333;
+          line-height: 60px;
+          text-align: center;
+          margin-bottom: 28px;
+          cursor: pointer;
+        }
+        .examine-selected{
+          width: 200px;
+          height: 60px;
+          background: #0045AF;
+          border-radius: 4px 4px 4px 4px;
+          font-size: 16px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #FFFFFF;
+          line-height: 60px;
+        }
+      }
+
+    }
+    .examineProcess-r{
+      width: 1310px;
+      .examineProcess-r-t{
+        display: flex;
+        justify-content: flex-start;
+        height: 92px;
+        width: 100%;
+        padding: 52px 0 0 40px;
+        box-sizing: border-box;
+        position: fixed;
+        >p{
+          width: 130px;
+          height: 40px;
+          border-radius: 0px 4px 4px 0px;
+          opacity: 1;
+          border: 1px solid #E0E0E0;
+          font-size: 14px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #333333;
+          line-height: 40px;
+          text-align: center;
+          cursor: pointer;
+        }
+        .btn-selected{
+          width: 130px;
+          height: 40px;
+          background: #0045AF;
+          border-radius: 4px 0px 0px 4px;
+          font-size: 14px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #FFFFFF;
+          line-height: 40px;
+          text-align: center;
+        }
+
+      }
+      .examineProcess-r-b{
+        flex:1;
+        padding:146px 0 0 0;
+        box-sizing: border-box;
+        .process-max-box{
+          width:350px;
+          height:215px;
+          margin:0 auto;
+          .process-big-box{
+            width:350px;
+            height:130px;
+            .process-text-box{
+              width:350px;
+              height:50px;
+              background: #0183fa;
+              display: flex;
+              img{
+                width:24px;
+                height:24px;
+                margin:13px 8px 13px 20px;
+              }
+              p{
+                flex:1;
+                font-size:16px;
+                color:#fff;
+                line-height:50px;
+              }
+            }
+            .process-name-p{
+              width:350px;
+              height:80px;
+              border:1px solid #e0e0e0;
+              line-height:80px;
+              font-size:16px;
+              padding-left:20px;
+            }
+          }
+          .process-img-box{
+            position: relative;
+            height:85px;
+            .process-img-bottom{
+              display: block;
+              width:17px;
+              height:85px;
+              margin:0 auto;
+            }
+            .process-add-button-img{
+              cursor: pointer;
+              position: absolute;
+              bottom:36px;
+              left:163px;
+              width:24px;
+              height:24px;
+            }
+          }
+        }
+        .process-max-box-for-over{
+          height:300px!important;
+        }
+        .process-max-box-for{
+          width:350px;
+          height:215px;
+          margin:0 auto;
+          .process-big-box{
+            width:350px;
+            height:130px;
+            .process-text-box{
+              width:350px;
+              height:50px;
+              background: #FFA50A;
+              display: flex;
+              img{
+                width:24px;
+                height:24px;
+                margin:13px 8px 13px 20px;
+              }
+              p{
+                flex:1;
+                font-size:16px;
+                color:#fff;
+                line-height:50px;
+              }
+              i{
+                cursor: pointer;
+                color:#fff;
+                font-size:24px;
+                line-height:50px;
+                margin:0 18px 0 0;
+              }
+            }
+            .process-name-box{
+              display: flex;
+              border:1px solid #e0e0e0;
+              cursor: pointer;
+              .process-name-p{
+                width:350px;
+                height:80px;
+                line-height:80px;
+                font-size:16px;
+                padding-left:20px;
+              }
+              .el-icon-arrow-right{
+                line-height:80px;
+                font-size:24px;
+                margin-right:13px;
+                color:#999;
+              }
+            }
+            .process-img-box{
+              position: relative;
+              height:85px;
+              .process-img-bottom{
+                display: block;
+                width:17px;
+                height:85px;
+                margin:0 auto;
+              }
+              .process-add-button-img{
+                cursor: pointer;
+                position: absolute;
+                bottom:36px;
+                left:163px;
+                width:24px;
+                height:24px;
+              }
+            }
+            .over-text-one{
+              text-align: center;
+              font-size:16px;
+              line-height:20px;
+              color:#3D3D3D;
+              margin:15px 0 10px 0;
+            }
+            .over-text-two{
+              text-align: center;
+              font-size:14px;
+              line-height:20px;
+              color:#999999;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+#approvalProcess-dialog-box{
+  p{
+    margin:0;
+  }
+  .el-dialog__body{
+    padding:0 30px;
+    .dialog-max-big-box{
+      display: flex;
+      .dialog-left-max-big-box{
+        flex:1;
+        .title-p{
+          margin:18px 0 14px 0;
+          font-size:16px;
+          color:#333;
+        }
+        .big-box{
+          width: 400px;
+          height:515px;
+          background: #F5F5F5;
+          border-radius: 6px;
+          overflow: hidden;
+          .input-box{
+            width:358px;
+            height:40px;
+            margin:21px 21px 0;
+            display: flex;
+            border-radius:6px;
+            overflow: hidden;
+            input{
+              border:none;
+              outline:none;
+              color:#333;
+              height:40px;
+              width:300px;
+              padding-left:10px;
+            }
+            input::placeholder{
+              color:#CCCCCC;
+            }
+            p{
+              cursor: pointer;
+              width:58px;
+              line-height:40px;
+              font-size:24px;
+              background: #fff;
+              color:#E0E0E0;
+              text-align: center;
+            }
+          }
+          .title-list-box{
+            width:400px;
+            padding:0 20px;
+            height:54px;
+            overflow-x: scroll;
+            overflow-y: hidden;
+            white-space: nowrap;
+            .title-for{
+              display: inline-block;
+              /*display: flex;*/
+              .spanColor{
+                color:#0045AF;
+                cursor: pointer;
+              }
+              span:nth-child(1){
+                display: inline-block;
+                line-height:54px;
+                font-size:14px;
+              }
+              span:nth-child(2){
+                display: inline-block;
+                width:24px;
+                text-align: center;
+                line-height:54px;
+                color:#333333;
+                font-size:14px;
+              }
+            }
+          }
+          .list-max-box{
+            height:400px;
+            .dept-box:hover{
+              background: rgba(0,69,175,0.1);
+            }
+            .dept-box{
+              cursor: pointer;
+              display: flex;
+              img:nth-child(1){
+                width:30px;
+                height:30px;
+                margin:11px 16px 0 23px;
+              }
+              p:nth-child(2){
+                flex:1;
+                line-height:52px;
+                font-size:14px;
+                color:#333;
+              }
+              img:nth-child(3){
+                width:20px;
+                height:20px;
+                margin: 16px 9px;
+              }
+              p:nth-child(4){
+                line-height:52px;
+                font-size:14px;
+                color:#0045af;
+                margin-right:22px;
+              }
+            }
+            .user-box:hover{
+              background: rgba(0,69,175,0.1);
+            }
+            .user-box{
+              cursor: pointer;
+              display: flex;
+              img:nth-child(1){
+                width:14px;
+                height:14px;
+                margin:12px 13px 0 28px;
+              }
+              p:nth-child(2){
+                line-height:40px;
+                color:#333;
+                font-size:14px;
+                flex:1;
+              }
+              p:nth-child(3){
+                line-height:40px;
+                color:#333;
+                font-size:14px;
+                margin-right:30px;
+              }
+            }
+          }
+        }
+      }
+      .dialog-right-max-big-box{
+        flex:1;
+        .title-p{
+          margin:18px 0 14px 20px;
+          font-size:16px;
+          color:#333;
+        }
+        .big-box{
+          width: 400px;
+          height:515px;
+          background: #F5F5F5;
+          border-radius: 6px;
+          margin-left:20px;
+          .user-for-box:hover{
+            background: rgba(0,69,175,0.1);
+          }
+          .user-for-box{
+            display: flex;
+            img{
+              width:40px;
+              height:40px;
+              margin:10px 23px 0 26px;
+              border-radius:50%;
+            }
+            p:nth-child(2){
+              flex:1;
+              line-height:60px;
+              font-size:14px;
+              color:#333;
+            }
+            p:nth-child(3){
+              cursor: pointer;
+              line-height:60px;
+              font-size:24px;
+              color:#A2A2A2;
+              margin-right:27px;
+            }
+          }
+        }
+      }
+    }
+  }
+  .dialog-bottom-box{
+    height:56px;
+    display: flex;
+    .pagination-box{
+      width:400px;
+    }
+    .radio-box{
+      flex:1;
+      font-size:14px;
+      margin-left:50px;
+      margin-top:22px;
+    }
+    .text-box{
+      margin-top:20px;
+      font-size:14px;
+      color:#999999;
+    }
+  }
+  .dialog-footer{
+    display: flex;
+    .dialog-footer-null-p{
+      flex:1;
+    }
+  }
+}
+</style>

src/views/chemicalManage/purchaseManage/purchaseExamine/index.vue

@@ -0,0 +1,187 @@
+<!--申购审核-->
+<template>
+  <div class="app-container purchaseExamine">
+    <div class="page-container purchaseExamine-page" v-if="pageType == 1">
+      <div class="page-form-title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm"
+                 :inline="true" style="width:100%;" label-width="90px">
+          <el-form-item label="">
+            <el-select style="width:140px;" v-model="queryParams.deptId" placeholder="请选择学院" clearable label-width="80px">
+              <el-option
+                v-for="dict in deptList"
+                :key="dict.deptId"
+                :label="dict.deptName"
+                :value="dict.deptId"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="">
+            <el-select v-model="queryParams.state " clearable placeholder="请选择状态" style="width: 140px">
+              <el-option
+                v-for="dict in options"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="">
+            <el-date-picker
+              v-model="queryParams.time"
+              size="small"
+              style="width: 140px"
+              value-format="yyyy-MM-dd"
+              type="date"
+              placeholder="请选择申请时间"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item label="">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="化学品名/CAS/实验室/申购人/课题组/课题组成员"
+              clearable
+              style="width: 360px"
+            />
+          </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>
+      <div class="page-content-box">
+        <el-table class="table-box" v-loading="loading" border :data="dataList" @selection-change="handleSelectionChange" ref="multipleTable">
+          <el-table-column type="selection" width="50" align="center"/>
+          <el-table-column label="申请时间" align="left" prop="name" />
+          <el-table-column label="申购人" align="left" prop="name" />
+          <el-table-column label="实验室" align="left" prop="name" />
+          <el-table-column label="学院" align="left" prop="name" />
+          <el-table-column label="楼栋楼层" align="left" prop="name" />
+          <el-table-column label="申购状态" align="left" prop="name" />
+          <el-table-column label="操作" align="left" class-name="small-padding fixed-width">
+            <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)"
+                >详情</p>
+                <p class="table-button-p"
+                   @click="tableButton(5,scope.row)"
+                >审核</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 exportComponent from "@/components/exportComponent/exportComponent.vue";
+  import { iotTypeList,iotTypeDetail,iotTypeAdd,iotTypeUpdate,iotTypeDelete } from "@/api/iotDevice";
+  //import infoPage from "./infoPage.vue"
+  import {listDepartments} from "@/api/commonality/noPermission";
+  export default {
+    name: 'index',
+    components: {
+      exportComponent,
+     // infoPage,
+
+    },
+    data(){
+      return{
+        loading:false,
+        pageType:1,
+        options:[{label:'启用',value:true},{label:'停用',value:false}],
+        queryParams:{
+          page:1,
+          pageSize:20,
+          searchValue :"",
+          deptId:'',
+          state :'',
+        },
+        dataList:[{}],
+        total:0,
+        deptList:[],
+        //组件传参
+        propsData:{},
+        exportConfig:{
+          api:'system/user/student/export',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'导出文件名',                         //导出文件的命名
+        },
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      //this.getList();
+      //this.listDepartments();
+    },
+    methods:{
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.queryParams.searchValue = "";
+        this.handleQuery();
+      },
+
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.ids = selection.map(item => item.id);
+        this.single = selection.length != 1;
+        this.multiple = !selection.length;
+      },
+      //获取学院
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptList = response.data;
+        });
+      },
+      //获取数据列表
+      getList(){
+        this.$set(this,'loading',true);
+        iotTypeList(this.queryParams).then(response => {
+          this.$set(this,'dataList',response.data.records);
+          this.$set(this,'total',response.data.total);
+          this.$set(this,'loading',false);
+        });
+      },
+      tableButton(type,row){
+        let self = this;
+        if(type == 2){
+          //详情
+          this.$set(this,'propsData',JSON.parse(JSON.stringify(row)));
+          this.$set(this,'pageType',2);
+        }else if(type == 5){
+
+        }else if(type == 'out'){
+          this.$set(this,'pageType',1);
+        }
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+
+.purchaseExamine{
+  .purchaseExamine-page{
+
+  }
+}
+</style>

src/views/chemicalManage/purchaseManage/purchaseRegister/index.vue

@@ -0,0 +1,233 @@
+<!--申购登记-->
+<template>
+  <div class="app-container purchaseRegister">
+    <div class="page-container purchaseRegister-page" v-if="pageType == 1">
+      <div class="page-form-title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm"
+                 :inline="true" style="width:100%;" label-width="90px">
+          <el-form-item label="">
+            <el-select style="width:140px;" v-model="queryParams.deptId" placeholder="请选择学院" clearable label-width="80px">
+              <el-option
+                v-for="dict in deptList"
+                :key="dict.deptId"
+                :label="dict.deptName"
+                :value="dict.deptId"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="">
+            <el-select v-model="queryParams.state " clearable placeholder="请选择状态" style="width: 140px">
+              <el-option
+                v-for="dict in options"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="">
+            <el-date-picker
+              v-model="queryParams.time"
+              size="small"
+              style="width: 140px"
+              value-format="yyyy-MM-dd"
+              type="date"
+              placeholder="请选择申请时间"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item label="">
+            <el-date-picker
+              v-model="queryParams.time"
+              size="small"
+              style="width: 140px"
+              value-format="yyyy-MM-dd"
+              type="date"
+              placeholder="请选择完成时间"
+            ></el-date-picker>
+          </el-form-item>
+
+          <el-form-item label="">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="化学品名/CAS/实验室/申购人/课题组/课题组成员"
+              clearable
+              style="width: 360px"
+            />
+          </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;margin-left:20px;"
+             @click="tableButton(5,'')"
+             v-hasPermiRouter="['demo:demo:demo']"
+          >申购</p>
+          <p class="page-add-common-style-button"
+             style="float: right;"
+             @click="tableButton(6,'')"
+             v-hasPermiRouter="['demo:demo:demo']"
+          >提交审核</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" ref="multipleTable">
+          <el-table-column type="selection" width="50" align="center"/>
+          <el-table-column label="申请时间" align="left" prop="name" />
+          <el-table-column label="申购人" align="left" prop="name" />
+          <el-table-column label="实验室" align="left" prop="name" />
+          <el-table-column label="学院" align="left" prop="name" />
+          <el-table-column label="楼栋楼层" align="left" prop="name" />
+          <el-table-column label="完成时间" align="left" prop="name" />
+          <el-table-column label="状态" align="left" prop="name" />
+          <el-table-column label="操作" align="left" class-name="small-padding fixed-width">
+            <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)"
+                >详情</p>
+                <p class="table-button-p"
+                   @click="tableButton(3,scope.row)"
+                >编辑</p>
+                <p class="table-button-p"
+                   @click="tableButton(4,scope.row)"
+                >删除</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 exportComponent from "@/components/exportComponent/exportComponent.vue";
+  import { iotTypeList,iotTypeDetail,iotTypeAdd,iotTypeUpdate,iotTypeDelete } from "@/api/iotDevice";
+  //import infoPage from "./infoPage.vue"
+  import {listDepartments} from "@/api/commonality/noPermission";
+  export default {
+    name: 'index',
+    components: {
+      exportComponent,
+     // infoPage,
+
+    },
+    data(){
+      return{
+        loading:false,
+        pageType:1,
+        options:[{label:'启用',value:true},{label:'停用',value:false}],
+        queryParams:{
+          page:1,
+          pageSize:20,
+          searchValue :"",
+          deptId:'',
+          state :'',
+        },
+        dataList:[{}],
+        total:0,
+        deptList:[],
+        //组件传参
+        propsData:{},
+        exportConfig:{
+          api:'system/user/student/export',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'导出文件名',                         //导出文件的命名
+        },
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      //this.getList();
+      //this.listDepartments();
+    },
+    methods:{
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.queryParams.searchValue = "";
+        this.handleQuery();
+      },
+
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.ids = selection.map(item => item.id);
+        this.single = selection.length != 1;
+        this.multiple = !selection.length;
+      },
+      //获取学院
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptList = response.data;
+        });
+      },
+      //获取数据列表
+      getList(){
+        this.$set(this,'loading',true);
+        iotTypeList(this.queryParams).then(response => {
+          this.$set(this,'dataList',response.data.records);
+          this.$set(this,'total',response.data.total);
+          this.$set(this,'loading',false);
+        });
+      },
+      tableButton(type,row){
+        let self = this;
+        if(type == 2){
+          //详情
+          this.$set(this,'propsData',JSON.parse(JSON.stringify(row)));
+          this.$set(this,'pageType',2);
+        }else if(type == 3){
+          //编辑
+          iotTypeDetail({id:row.typeId}).then(response => {
+            this.dialogFormReset();
+            this.$set(this,'dialogForm',JSON.parse(JSON.stringify(response.data)));
+            this.$set(this,'dialogType',true);
+          });
+        }else if(type == 4){
+          //删除
+          this.$confirm('是否确认删除?', "警告", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(function() {
+          }).then(() => {
+            iotTypeDelete({typeId:row.typeId}).then(response => {
+              self.msgSuccess(response.message)
+              self.getList();
+            });
+          }).catch(() => {});
+        }else if(type == 'out'){
+          this.$set(this,'pageType',1);
+        }
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+
+.purchaseRegister{
+  .purchaseRegister-page{
+
+  }
+}
+</style>

src/views/chemicalManage/useLedger/infoPage.vue

@@ -50,6 +50,33 @@
                       <p>李砖头</p>
                     </div>
               </div>
+              <div class="record-li">
+                <div class="record-li-t">
+                  <div class="record-li-t-l">空瓶出库</div>
+                  <div class="record-li-t-r">
+                    <p>操作视频</p>
+                    <p>开门视频</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>2023/09/15  16:39</p>
+                  <p>400ml</p>
+                  <p>400ml</p>
+                  <p>是</p>
+                  <p>手工录入</p>
+                  <p>张漂亮、李砖头</p>
+                  <p>李砖头</p>
+                </div>
+              </div>
             </div>
         </div>
     </div>