zc

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

@@ -98,6 +98,7 @@
       </div>
     </div>
     <!--<add-page :propsData="propsData" v-if="pageType === 2"></add-page>-->
+    <add-chemicals ref="addChemicals"></add-chemicals>
     <msds-page v-if="pageType == 2"></msds-page>
   </div>
 </template>
@@ -106,12 +107,14 @@
   //import { systemUserSelect } from "@/api/commonality/permission";
   //import { getInfo } from "@/api/basicsModules/index";
   //import addPage from "./addPage.vue";
+  import addChemicals from "@/views/chemicalManage/components/addChemicals.vue";
   import importComponent from "@/components/importComponent/importComponent.vue";
   import exportComponent from "@/components/exportComponent/exportComponent.vue";
   import msdsPage from "./msdsPage.vue"
   export default {
     name: 'index',
     components: {
+      addChemicals,
       exportComponent,
       importComponent,
       msdsPage
@@ -199,6 +202,7 @@
         let self = this;
         if(type == 1){
           //新增
+          this.$refs.addChemicals.addChemicalsOpen('1');
         }else if(type == 2){
           //MSDS
           this.$set(this,'pageType',2);
@@ -207,6 +211,7 @@
           this.$set(this,'propsData',obj);
         }else if(type == 3){
           //编辑
+          this.$refs.addChemicals.addChemicalsOpen('2',row);
         }else if(type == 4){
           //删除
           this.$confirm('是否确认删除?', "警告", {

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

@@ -240,6 +240,8 @@
       qrCodeDialogButton(type,id,name){
         if(type == 1){
           this.$set(this,'qrCodeDialogData',{
+            title:'化学品名称',
+            download:true,
             type:'chemicalsCabinet',                                  //二维码类型 用于区分二维码功能类型
             parameter:id,                                             //二维码参数
             name:name,                                                //二维码名称用于下载时命名

src/views/chemicalManage/components/addChemicals.vue

@@ -0,0 +1,211 @@
+<!--
+
+  <add-chemicals ref="addChemicals"></add-chemicals>
+
+  import addChemicals from "@/views/chemicalManage/components/addChemicals.vue";
+
+  components: {
+    addChemicals
+  },
+
+  //新增
+  this.$refs.addChemicals.addChemicalsOpen('1');
+
+  //编辑
+  this.$refs.addChemicals.addChemicalsOpen('2',row);
+
+-->
+<template>
+  <el-dialog class="addChemicals"
+             :modal-append-to-body="false"
+             :close-on-click-modal="false" :close-on-press-escape="false"
+             :title="lookImgDialogTitle"
+             :visible.sync="lookImgDialogType"
+             v-if="lookImgDialogType"
+             width="800px" height="482px"
+             append-to-body>
+    <div class="form-box">
+      <el-form :model="dialogForm" ref="dialogForm" :inline="true" :rules="dialogRules" class="addCheckPage-min">
+        <el-form-item label="化学品名：" prop="data1" label-width="130px">
+          <el-input v-model="dialogForm.data1" placeholder="请输入化学品名" maxLength="20" style="width:590px;"/>
+        </el-form-item>
+        <div>
+          <el-form-item label="类别：" prop="data2" label-width="130px">
+            <el-select v-model="dialogForm.data2" placeholder="请选择类别" style="width: 245px">
+              <el-option
+                v-for="dict in categoryOptions"
+                :key="dict.itemId"
+                :label="dict.label"
+                :value="dict.itemId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="级别：" prop="data3" label-width="90px">
+            <el-select v-model="dialogForm.data3" placeholder="请选择级别" style="width: 245px">
+              <el-option
+                v-for="dict in rankOptions"
+                :key="dict.itemId"
+                :label="dict.label"
+                :value="dict.itemId"
+              />
+            </el-select>
+          </el-form-item>
+        </div>
+        <div>
+          <el-form-item label="CAS：" prop="data4" label-width="130px">
+            <el-input v-model="dialogForm.data4" placeholder="请输入CAS码" maxLength="20" style="width:245px;"/>
+          </el-form-item>
+          <el-form-item label="别名：" prop="data5" label-width="90px">
+            <el-input v-model="dialogForm.data5" placeholder="请输入化学品别名" maxLength="20" style="width:245px;"/>
+          </el-form-item>
+        </div>
+        <div>
+          <el-form-item label="纯度：" prop="data6" label-width="130px">
+            <el-input v-model="dialogForm.data6" placeholder="请输入化学品纯度" maxLength="20" style="width:245px;"/>
+          </el-form-item>
+          <el-form-item label="密度：" prop="data7" label-width="90px">
+            <el-input-number v-model="dialogForm.data7" controls-position="right" style="width:245px;"
+                             :precision="2" :step="0.1" :min="-10" :max="10"></el-input-number>
+          </el-form-item>
+        </div>
+        <el-form-item label="实验室存放规定：" prop="data8" label-width="130px">
+          <el-input placeholder="请输入" v-model="dialogForm.data8" style="width:245px;"
+                    maxlength="5" onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">
+            <template slot="append">
+              <el-select v-model="dialogForm.data9" placeholder="请选择" style="width: 62px">
+                <el-option
+                  v-for="dict in stateOfMatter"
+                  :key="dict.itemId"
+                  :label="dict.label"
+                  :value="dict.itemId"
+                />
+              </el-select>
+            </template>
+          </el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div slot="footer" class="dialog-footer dialog-footer-box">
+      <p class="dialog-footer-button-null"></p>
+      <p class="dialog-footer-button-info" @click="addChemicalsOpen(3)">取消</p>
+      <p class="dialog-footer-button-primary" @click="dialogSubmit">确定</p>
+      <p class="dialog-footer-button-null"></p>
+    </div>
+  </el-dialog>
+</template>
+<script>
+  import { getDicts } from "@/api/commonality/noPermission";
+  export default {
+    name: 'addChemicals',
+    data () {
+      return {
+        lookImgDialogType:false,
+        lookImgDialogTitle:'',
+        //化学品类别
+        categoryOptions:[],
+        //级别
+        rankOptions:[{itemId:'1',label:'管控'},{itemId:'2',label:'非管控'}],
+        //物质状态
+        stateOfMatter:[{itemId:'1',label:'kg'},{itemId:'2',label:'L'}],
+        dialogForm:{
+          data1:null,
+          data2:null,
+          data3:null,
+          data4:null,
+          data5:null,
+          data6:null,
+          data7:1,
+          data8:null,
+          data9:1,
+        },
+        dialogRules:{
+          data1: [
+            { required: true, message: "请输入化学品名", trigger: "blur" },
+            { required: true, message: "请输入化学品名", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          data2: [
+            { required: true, message: "请选择类别", trigger: "blur" },
+            { required: true, message: "请选择类别", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          data3: [
+            { required: true, message: "请选择级别", trigger: "blur" },
+            { required: true, message: "请选择级别", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          data7: [
+            { required: true, message: "请输入密度", trigger: "blur" },
+            { required: true, message: "请输入密度", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+        },
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+
+    },
+    methods:{
+      //调用方法
+      addChemicalsOpen(type,row){
+        if(type == 1){
+          this.initialize();
+          this.$set(this,'dialogForm',{
+            data1:null,
+            data2:null,
+            data3:null,
+            data4:null,
+            data5:null,
+            data6:null,
+            data7:1,
+            data8:null,
+            data9:1,
+          });
+          this.$set(this,'lookImgDialogTitle','添加化学品');
+          this.$set(this,'lookImgDialogType',true);
+        }else if(type == 2){
+          this.initialize();
+          this.$set(this,'dialogForm',{
+            id:row.id,
+            data1:row.data1,
+            data2:row.data2,
+            data3:row.data3,
+            data4:row.data4,
+            data5:row.data5,
+            data6:row.data6,
+            data7:row.data7,
+            data8:row.data8,
+            data9:row.data9,
+          });
+          this.$set(this,'lookImgDialogTitle','编辑化学品');
+          this.$set(this,'lookImgDialogType',true);
+        }else if(type == 3){
+          this.$set(this,'dialogForm',{});
+          this.$set(this,'lookImgDialogTitle','');
+          this.$set(this,'lookImgDialogType',false);
+        }
+      },
+      //初始化
+      initialize(){
+        //化学品类别字典
+        getDicts('chemicals_category').then(response => {
+          this.$set(this,'categoryOptions',response.data);
+        });
+      },
+      //提交
+      dialogSubmit(){
+        this.$refs["dialogForm"].validate(valid => {
+          if (valid) {
+
+          }
+        })
+      }
+    },
+  }
+</script>
+<style scoped lang="scss">
+  .addChemicals{
+    .form-box{
+
+    }
+  }
+</style>