heayng

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

@@ -0,0 +1,184 @@
+<template>
+  <div class="page-container purchaseRegister-addPage">
+    <div class="page-top-title-box">
+      <p class="page-top-title-name-p">{{newData.id?'编辑':'申购'}}</p>
+      <p class="page-top-title-out-p" @click="backPage">返回</p>
+    </div>
+    <div class="content-box">
+      <div class="content-box-t">
+        <el-form class="add-form-box" :model="newData" ref="form" :rules="rules" label-width="164px">
+          <div class="content-box-t-t">申购信息</div>
+          <div class="content-box-t-m">
+            <el-form-item label="实验室：" prop="subId">
+              <el-select v-model="newData.subId" placeholder="请选择实验室" style="width: 350px">
+                <el-option v-for="item in subOptions" :key="item.subId" :label="item.subName" :value="item.subId"/>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="申购人：" prop="name">
+              <el-input v-model="newData.deviceName" placeholder="回显当前账号姓名-联系电话" maxLength="20" style="width:350px;"></el-input>
+            </el-form-item>
+            <div class="research-selete">
+              <img src="@/assets/ZDimages/chemicalManage/icon_6.png">
+              <i>课题组</i>
+              <el-select v-model="newData.subId" placeholder="回显所属课题组" style="width: 350px">
+                <el-option v-for="item in subOptions" :key="item.subId" :label="item.subName" :value="item.subId"/>
+              </el-select>
+            </div>
+          </div>
+          <div class="content-box-t-b">
+            <el-form-item label="用途：">
+              <el-input type="textarea" v-model="newData.deviceName" placeholder="请输入用途" maxLength="20" style="width:350px;height:100px;"></el-input>
+            </el-form-item>
+            <div class="content-box-t-b-r">
+              <el-form-item label="导师：">
+                <el-input  v-model="newData.deviceName" placeholder="回显所属导师-联系电话" maxLength="20" style="width:825px;"></el-input>
+              </el-form-item>
+              <div><p>液体已存储量：6666ml（上限100000ml）</p><p>固体已存储量：1000g（上限100000g）</p></div>
+            </div>
+          </div>
+        </el-form>
+      </div>
+    </div>
+    <div class="page-bottom-button-box">
+      <p class="page-bottom-button-null-p"></p>
+      <p class="page-bottom-button-cancel-p" @click="backPage" >取消</p>
+      <p class="page-bottom-button-submit-p" @click="submitForm">提交审核</p>
+      <p class="page-bottom-button-submit-p" style="margin-left:0px;" @click="submitForm" >保存</p>
+      <p class="page-bottom-button-null-p"></p>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { systemBuildingGetTreeList,laboratorySubRelInfoGetListByFloor } from "@/api/commonality/permission";
+  export default {
+    name: 'addPage',
+    props:{
+      propsData:{},
+    },
+    components: {
+
+    },
+    data(){
+      return{
+        newData:{},
+        subOptions:[],
+        rules:{
+          subId: [
+            { required: true, message: "请选择实验室", trigger: "blur" },
+          ],
+          name: [
+            { required: true, message: "请输入申购人", trigger: "blur" },
+          ],
+        },
+
+      }
+    },
+    created(){
+      //this.initialize();
+    },
+    mounted(){
+
+    },
+    methods:{
+      radioFun(){
+        this.$set(this.newData,'state',!this.newData.state)
+      },
+      initialize(){
+        //编辑
+        if(this.propsData.id){
+          this.$set(this,'newData',{
+            id:this.propsData.id,
+          });
+
+        }else{
+          this.$set(this,'newData',{
+            deviceName:'',
+            deviceNo:'',
+            typeId:'',
+            typeKey:'',
+            typeName:'',
+            attributeId:'',
+            code:'',
+            state:true,
+            address:[],
+            subId:'',
+            remark:'',
+          });
+        }
+      },
+      // 返回按钮
+      backPage(){
+        this.$parent.tableButton('out','');
+      },
+      /** 提交按钮 */
+      submitForm() {
+        this.$refs["form"].validate(maxValid => {
+          this.$refs.forElFormItem.$refs["form"].validate(valid => {
+            if (valid) {
+
+            }
+          })
+        })
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .purchaseRegister-addPage{
+    .content-box{
+      flex:1;
+      display: flex;
+      overflow: hidden;
+      .content-box-t{
+        width: 100%;
+        padding: 34px 100px 40px 0px;
+        box-sizing: border-box;
+        .content-box-t-t{
+          padding-left: 80px;
+          box-sizing: border-box;
+          font-size: 16px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #333333;
+          line-height: 24px;
+        }
+        .content-box-t-m{
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          .research-selete{
+            display: flex;
+            justify-content: flex-start;
+            align-items: center;
+            margin-bottom: 20px;
+            >img{
+              width: 18px;
+              height: 18px;
+              margin-left: 32px;
+            }
+            >i{
+              width: 48px;
+              font-size: 16px;
+              font-family: Microsoft YaHei, Microsoft YaHei;
+              font-weight: 400;
+              color: #333333;
+              line-height: 24px;
+              margin-left: 10px;
+              margin-right: 16px;
+              font-style: normal;
+            }
+          }
+        }
+        .content-box-t-b{
+          display: flex;
+          justify-content: flex-start;
+          .content-box-t-b-r{
+
+          }
+        }
+      }
+    }
+  }
+</style>

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

@@ -109,20 +109,23 @@
         />
       </div>
     </div>
+    <add-page v-if="pageType == 2" :propsData="propsData"></add-page>
+    <info-page v-if="pageType == 3" :propsData="propsData"></info-page>
   </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 addPage from "./addPage.vue"
+  import infoPage from "./infoPage.vue"
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
   import {listDepartments} from "@/api/commonality/noPermission";
   export default {
     name: 'index',
     components: {
       exportComponent,
-     // infoPage,
-
+      addPage,
+      infoPage,
     },
     data(){
       return{
@@ -195,13 +198,15 @@
           //详情
           this.$set(this,'propsData',JSON.parse(JSON.stringify(row)));
           this.$set(this,'pageType',2);
+        }else if(type == 5){
+          //申购
+          this.$set(this,'pageType',2);
         }else if(type == 3){
+          this.$set(this,'pageType',2);
           //编辑
-          iotTypeDetail({id:row.typeId}).then(response => {
-            this.dialogFormReset();
-            this.$set(this,'dialogForm',JSON.parse(JSON.stringify(response.data)));
-            this.$set(this,'dialogType',true);
-          });
+          // iotTypeDetail({id:row.typeId}).then(response => {
+          //
+          // });
         }else if(type == 4){
           //删除
           this.$confirm('是否确认删除?', "警告", {

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

@@ -0,0 +1,256 @@
+<template>
+  <div class="page-container infoPage">
+    <div class="page-top-title-box">
+      <p class="page-top-title-name-p">详情</p>
+      <p class="page-top-title-out-p" @click="backPage">返回</p>
+    </div>
+    <div class="content-box scrollbar-box">
+        <div class="content-box-left">
+            <li class="chemical-name">化学品名称<p class="chemical-state">已出库</p></li>
+            <li>形态/纯度/CAS12-34-56</li>
+            <li>类别：易制毒<p class="control-state">管控</p></li>
+            <li>编码：123456789</li>
+            <li>RFID标签：123456789</li>
+            <li>规格：500ml/瓶</li>
+            <li>实时库存：500ml</li>
+            <li>过期时间：2023-10-29 | 30天前提醒</li>
+            <li>领用时效：1小时</li>
+            <li>实验室：实验室名称（房间号）</li>
+            <li>安全员：曹秀康-13227872222</li>
+            <li>位置：化学品柜-柜门-层</li>
+            <li>归属人：李砖头</li>
+        </div>
+        <div class="lines"></div>
+        <div class="content-box-right">
+            <div class="record">
+              <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 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>
+  </div>
+</template>
+
+<script>
+  import {} from "@/api/chemicalManage/index";
+  export default {
+    name: 'infoPage',
+    props:{
+      propsData:{},
+    },
+    data(){
+      return{
+        showType:false,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+
+    },
+    methods:{
+      // 返回按钮
+      backPage(){
+        this.$parent.tableButton(7);
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .infoPage{
+    .content-box{
+      flex:1;
+      display: flex;
+      padding:20px;
+      .content-box-left{
+        width: 412px;
+        padding: 0 28px 0 60px;
+        box-sizing: border-box;
+        >li{
+          list-style-type: none;
+          font-size: 16px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #333333;
+          margin-bottom: 30px;
+          display: flex;
+        }
+        .chemical-name{
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          .chemical-state{
+            width: 80px;
+            height: 30px;
+            background: #0183FA;
+            border-radius: 6px 6px 6px 6px;
+            font-size: 16px;
+            font-family: Microsoft YaHei, Microsoft YaHei;
+            font-weight: 400;
+            color: #FFFFFF;
+            line-height: 30px;
+            text-align: center;
+          }
+        }
+
+        .control-state{
+          width: 50px;
+          height: 24px;
+          border-radius: 4px 4px 4px 4px;
+          opacity: 1;
+          border: 1px solid #FC7F1A;
+          font-size: 12px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #FC7F1A;
+          line-height: 24px;
+          text-align: center;
+          margin-left:10px;
+          float: right;
+        }
+      }
+      .lines{
+        width:1px ;
+        height: 760px;
+        opacity: 1;
+        border: 1px dashed #D8D8D8;
+      }
+      .content-box-right{
+        margin-left:56px ;
+        .record{
+          width: 1028px;
+          height:auto;
+          opacity: 1;
+          border-bottom: 1px dashed #D8D8D8;
+          padding-bottom: 20px;
+          .record-li{
+            margin-bottom: 20px;
+            .record-li-t{
+              display: flex;
+              justify-content: space-between;
+              .record-li-t-l{
+                width: 150px;
+                height: 40px;
+                background: #0183FA;
+                border-radius: 8px 8px 0px 0px;
+                font-size: 16px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                font-weight: 400;
+                color: #FFFFFF;
+                line-height: 40px;
+                text-align: center;
+              }
+              .record-li-t-r{
+                display: flex;
+                >p{
+                  width: 100px;
+                  height: 30px;
+                  border-radius: 6px 6px 6px 6px;
+                  opacity: 1;
+                  border: 1px solid #0183FA;
+                  font-size: 16px;
+                  font-family: Microsoft YaHei, Microsoft YaHei;
+                  font-weight: 400;
+                  color: #0183FA;
+                  line-height: 30px;
+                  text-align: center;
+                  margin-left:10px;
+                  cursor: pointer;
+                }
+              }
+            }
+            .record-li-m{
+              display: flex;
+              justify-content: flex-start;
+              border: 1px solid #E0E0E0;
+              >p{
+                flex: 1;
+                height: 40px;
+                background: #F5F5F5;
+                font-size: 16px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+                line-height: 40px;
+                text-align: center;
+                border-right: 1px solid #E0E0E0;
+              }
+            }
+            .record-li-b{
+              display: flex;
+              justify-content: flex-start;
+              border-bottom: 1px solid #E0E0E0;
+              border-left: 1px solid #E0E0E0;
+              border-right: 1px solid #E0E0E0;
+              >p{
+                flex: 1;
+                height: 40px;
+                font-size: 14px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+                line-height: 40px;
+                text-align: center;
+                border-right: 1px solid #E0E0E0;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/chemicalManage/useLedger/index.vue

@@ -246,7 +246,7 @@
           //详情
           this.$set(this,'propsData',JSON.parse(JSON.stringify(row)));
           this.$set(this,'pageType',2);
-        }else if(type ==7){
+        }else if(type =='out'){
           this.$set(this,'pageType',1);
         }
       },

src/views/chemicalManage/useLedger/infoPage.vue

@@ -104,7 +104,7 @@
     methods:{
       // 返回按钮
       backPage(){
-        this.$parent.tableButton(7);
+        this.$parent.tableButton('out','');
       },
     }
   }