Merge remote-tracking branch 'origin/master'

value

2023-09-07 523d7a54fb07fdf756fbc4faa5eb7fef7263a556

 src/views/inspectionManagement/reportForInspection/index.vue

@@ -1,302 +1,645 @@
<template>
    <div class="content-main">
        <div class="top-bar">
            <el-form ref="form" :inline="true" :model="searchData">
            <el-form-item label="材料编码:" class="sermargin">
              <el-input
                v-model="searchData.code"
                class="input-form"
                placeholder="请输入"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="材料名称:" class="sermargin">
              <el-input
                v-model="searchData.name"
                class="input-form"
                placeholder="请输入"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="状态:" class="sermargin">
              <el-select v-model="searchData.state" placeholder="全部">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="来料日期:" style="margin-right: 20px;">
              <el-input
                v-model="searchData.date"
                class="input-form"
                placeholder="请输入"
              >
              </el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary">查询</el-button>
              <el-button type="primary" plain>重置</el-button>
            </el-form-item>
            </el-form>
        </div>
        <div class="library-table">
          <div class="table-header">
            <div class="search-bar">
              <el-radio-group v-model="radioValue">
                <el-radio-button label="全部" />
                <el-radio-button label="待检验" />
                <el-radio-button label="已检验" />
              </el-radio-group>
            </div>
            <div class="generateInsp">
              <el-button type="primary" size="mini" icon="el-icon-document" style="background-color: rgb(1, 102, 226);">生成报检单</el-button>
            </div>
          </div>
          <div class="table-box">
            <el-table
              ref="inspectionTable"
              :max-height="800"
              :cell-style="{textAlign: 'center'}"
              :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
              :data="inspectionTable"
              style="width: 100%"
            >
              <el-table-column
                type="selection"
                label=""
                min-width="10%"
              /> 
              <el-table-column
                type="index"
                label="序号"
                min-width="8%"
              />
              <el-table-column
                prop="date"
                label="来料日期"
                min-width="8%"
              />
              <el-table-column
                prop="providerName"
                label="供应商名称"
                min-width="12%"
              />
              <el-table-column
                prop="code"
                label="材料编码"
                min-width="8%"
              />
              <el-table-column
                prop="name"
                label="材料名称"
                min-width="8%"
              />
              <el-table-column
                prop="modelandspecification"
                label="规格型号"
                min-width="12%"
              />
              <el-table-column
                prop="unit"
                label="单位"
                min-width="5%"
              />
              <el-table-column
                prop="amount"
                label="数量"
                min-width="5%"
              />
              <el-table-column
                prop="commisiondate"
                label="报检日期"
                min-width="8%"
              />
              <el-table-column
                prop="person"
                label="检验人"
                min-width="8%"
              />
              <el-table-column
                prop="checkdate"
                label="检验日期"
                min-width="8%"
              />
              <el-table-column
                prop="state"
                label="状态"
                min-width="8%"
              >
              <template slot-scope="scope">
                <span :style="{ color: scope.row.state === '已检测' ? 'green' : 'red' }">
                  {{ scope.row.state }}
                </span>
              </template>
              </el-table-column>
            </el-table>
            <!-- 分页器 -->
            <div>
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[100, 200, 300, 400]"
                :page-size="100"
                layout="total, sizes, prev, pager, next, jumper"
                :total="400">
              </el-pagination>
            </div>
          </div>
        </div>
    </div>
   <div class="content-main">
      <div class="rawPage">
         <div class="top-bar">
            <el-form ref="form" :inline="true" :model="searchData">
               <el-form-item label="材料编码:" position="left" class="sermargin">
                  <el-input size="small" v-model="searchData.code" class="input-form" placeholder="请输入">
                  </el-input>
               </el-form-item>
               <el-form-item label="材料名称:" class="sermargin">
                  <el-input size="small" v-model="searchData.name" class="input-form" placeholder="请输入材料名称">
                  </el-input>
               </el-form-item>
               <el-form-item label="状态:" class="sermargin">
                  <el-select size="small" v-model="searchData.state" placeholder="全部">
                     <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                     </el-option>
                  </el-select>
               </el-form-item>
               <el-form-item label="来料日期:" style="margin-right: 20px;">
                  <el-date-picker size="small" value-format="yyyy-MM-dd" v-model="searchData.date" class="input-form" placeholder="请选择来料日期">
                  </el-date-picker>
               </el-form-item>
               <el-form-item>
                  <el-button size="small" type="primary" @click="search">查询</el-button>
                  <el-button size="small" type="primary" plain @click="reset">重置</el-button>
                  <el-button size="small" type="primary" icon="el-icon-plus" @click="addReportVisible = true">新增</el-button>
               </el-form-item>
            </el-form>
         </div>
         <el-dialog title="新增原材料报检" :visible.sync="addReportVisible" width="40%">
            <el-form ref="addMaterialForm" :rules="insertRule" :model="insertData" :inline="true" label-position="right"
               label-width="100px">
               <el-form-item label="来料日期:" prop="fromDate">
                  <el-date-picker v-model="insertData.fromDate" type="date" value-format="yyyy-MM-dd"></el-date-picker>
               </el-form-item>
               <el-form-item label="供货商名称:" prop="supplierName">
                  <el-input v-model="insertData.supplierName" />
               </el-form-item>
               <el-form-item label="材料名称:" prop="mName">
                  <el-select v-model="insertData.mName" placeholder="请选择材料名称" @change="(val)=>{getSpecification(val)}">
                     <el-option v-for="(item,index) in materialList" :key="index" :label="item.name"
                        :value="item.id"></el-option>
                  </el-select>
               </el-form-item>
               <el-form-item label="材料编码:" prop="mCode">
                  <el-input disabled v-model="insertData.mCode" />
               </el-form-item>
               <el-form-item label="规格型号:" prop="specificationsNumber">
                  <el-cascader v-model="insertData.specificationsNumber" :options="childrenOptions"
                     :props="{label: 'Name', value: 'Id'}" separator="-"></el-cascader>
               </el-form-item>
               <el-form-item label="单位:" prop="unit">
                  <el-input type="text" v-model="insertData.unit" />
               </el-form-item>
               <el-form-item label="数量:" prop="num">
                  <el-input type="number" min="0" v-model="insertData.num"/>
               </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
               <el-button @click="addReportVisible = false">取 消</el-button>
               <el-button type="primary" @click="insert()">确 定</el-button>
            </span>
         </el-dialog>
         <div class="library-table">
            <div class="table-header">
               <div class="generateInsp">
                  <el-button @click="addReportBtn" type="primary" size="mini" icon="el-icon-document"
                     style="background-color: rgb(1, 102, 226);">生成报检单</el-button>
               </div>
            </div>
            <div class="table-box">
               <el-table ref="inspectionTable" :max-height="450" :cell-style="{textAlign: 'left'}"
                  :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'left'}"
                  :data="inspectionTable" style="width: 100%" @selection-change="handleSelectionChange"
                  :default-sort = "{prop: 'createTime', order: 'descending'}"
                  >
                  <el-table-column type="selection" :selectable="checkSelect" min-width="5%"></el-table-column>
                  <el-table-column type="index" label="序号" min-width="8%" />
                  <el-table-column prop="dateSurvey" label="来料日期" min-width="8%" />
                  <el-table-column prop="supplierName" label="供应商名称" min-width="12%" />
                  <el-table-column prop="materialCoding" label="材料编码" min-width="8%" />
                  <el-table-column prop="materialName" label="材料名称" min-width="8%" />
                  <el-table-column prop="specificationsModels" label="规格型号" min-width="12%" />
                  <el-table-column prop="unit" label="单位" min-width="5%" />
                  <el-table-column prop="quantity" label="数量" min-width="5%" />
                  <el-table-column prop="inspectionDate" label="报检日期" min-width="8%" />
                  <el-table-column v-if="1===0" prop="createTime" label="日期" min-width="8%" />
                  <el-table-column prop="surveyor" label="检验人" min-width="8%" />
                  <el-table-column prop="type" label="状态" min-width="8%">
                     <template slot-scope="scope">
                        <span :style="{ color: scope.row.type === 1 ? 'green' : 'red' }">
                           {{ scope.row.type === 1 ? '已报检':'未报检' }}
                        </span>
                     </template>
                  </el-table-column>
                  <el-table-column label="操作" min-width="8%">
                     <template slot-scope="scope">
                        <el-button type="text" size="small" @click="removeFun(scope.row,scope.$index)">删除</el-button>
                     </template>
                  </el-table-column>
               </el-table>
               <!-- 分页器 -->
               <div>
                  <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                     :current-page="currentPage" :page-sizes="[10, 15, 20,30]" :page-size="pageSize"
                     layout="total, sizes, prev, pager, next, jumper" :total="total">
                  </el-pagination>
               </div>
            </div>
         </div>
      </div>
      <el-dialog title="选择日期" :visible.sync="addReportDialog" width="60%">
         <el-form :model="addInspectionForm" :rules="addInspectionFormRules" ref="addInspectionForm">
            <el-form-item label="检验日期" label-width="100px" prop="inspectionDate">
               <el-date-picker v-model="addInspectionForm.inspectionDate" type="daterange" value-format="yyyy-MM-dd"
                  range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
               </el-date-picker>
            </el-form-item>
            <el-form-item label="当前版本" label-width="100px" prop="version">
               <el-select @change="changeVersionFun" v-model="addInspectionForm.version" placeholder="请选择版本">
                  <el-option v-for="item in chooseVersion" :key="item.value" :label="item.label" :value="item.value" ></el-option>
               </el-select>
            </el-form-item>
         </el-form>
      <el-table
        style="width:90%;margin-left:5%" 
        :data="standardLibraryData" row-key="id" border
        default-expand-all ref="multipleTable"
        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
        <el-table-column type="index" width="50px" label="序号"></el-table-column>
        <el-table-column label="项目名称" prop="name" sortable></el-table-column>
        <el-table-column prop="unit" label="单位" sortable></el-table-column>
        <el-table-column label="标准值" prop="required" sortable></el-table-column>
        <el-table-column prop="internal" label="内控值" sortable></el-table-column>
      </el-table>
         <div slot="footer" class="dialog-footer">
            <el-button @click="resetForm('addInspectionForm')">取 消</el-button>
            <el-button type="primary" @click="confirmBtn('addInspectionForm')">确 定</el-button>
         </div>
      </el-dialog>
   </div>
</template>

<script>
export default {
  data() {
    return {
      form: [],
      searchData: {
        code: '',
        name: '',
        state: '',
        date: ''
      },
      options: [{
        value: '1',
        label: '部门1'
      }, {
        value: '2',
        label: '部门2'
      }, {
        value: '3',
        label: '部门3'
      }],
      radioValue: '',
      inspectionTable: [{
        date: '2023-07-28',
        providerName: '国网山东省电力有限公司',
        code: 'BP214274',
        name: '铝包钢绞线',
        modelandspecification: 'JLHA/G1A-185/30-26/7',
        unit: '吨',
        amount: '21',
        commisiondate: '2023-08-02',
        person: '黄小明',
        checkdate: '2023-12-09',
        state: '已检测'
      }, {
        date: '2023-07-28',
        providerName: '国网山东省电力有限公司',
        code: 'BP214274',
        name: '铝包钢绞线',
        modelandspecification: 'JLHA/G1A-185/30-26/7',
        unit: '吨',
        amount: '21',
        commisiondate: '2023-08-02',
        person: '黄小明',
        checkdate: '2023-12-09',
        state: '待检测'
      }, {
        date: '2023-07-28',
        providerName: '国网山东省电力有限公司',
        code: 'BP214274',
        name: '铝包钢绞线',
        modelandspecification: 'JLHA/G1A-185/30-26/7',
        unit: '吨',
        amount: '21',
        commisiondate: '2023-08-02',
        person: '黄小明',
        checkdate: '2023-12-09',
        state: '已检测'
      }, {
        date: '2023-07-28',
        providerName: '国网山东省电力有限公司',
        code: 'BP214274',
        name: '铝包钢绞线',
        modelandspecification: 'JLHA/G1A-185/30-26/7',
        unit: '吨',
        amount: '21',
        commisiondate: '2023-08-02',
        person: '黄小明',
        checkdate: '2023-12-09',
        state: '待检测'
      }],
      currentPage: 0
    }
  },
  methods: {
    // 每页条数改变时触发 选择一页显示多少行
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      this.currentPage = 1
      this.pageSize = val
    },
    // 当前页改变时触发 跳转其他页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`)
      this.currentPage = val
    }
  }
}
   import {
      getRawMaterialList,
      addInspect,
      selectInspectsListById,
      selectUser,
      selectEquipment,
      deleteMaterial,
      addMaterial,
      getMaterielName,
      getSpecification,
    getChooseVersion,
    lookProByVer
   } from '@/api/inspection/rawmaterial'
import ItemVue from '@/layout/components/Sidebar/Item.vue'
   export default {
      data() {
         return {
        standardLibraryData:[],
        chooseVersion: [],
            addInspectionForm: {
               inspectionDate: [],
               version: null
            },
            addInspectionFormRules: {
               inspectionDate: [{
                  required: true,
                  message: '请选择日期区间',
                  trigger: 'change'
               }],
            },
            addReportDialog: false,
            insertData: {},
            addReportVisible: false,
            checked: false,
            resultData: {},
            checkData: [],
            form: [],
            searchData: {
               code: '',
               name: '',
               state: '',
               date: ''
            },
            childrenOptions: [{
               value: 'zhinan',
               label: '指南',
               children: [{
                  value: 'shejiyuanze',
                  label: '设计原则',
                  children: [{
                     value: 'yizhi',
                     label: '一致'
                  }, {
                     value: 'fankui',
                     label: '反馈'
                  }, {
                     value: 'xiaolv',
                     label: '效率'
                  }, {
                     value: 'kekong',
                     label: '可控'
                  }]
               }]
            }],
            options: [{
               value: null,
               label: '全部'
            }, {
               value: 1,
               label: '已报检'
            }, {
               value: 0,
               label: '未报检'
            }],
            radioOptions: [{
               label: '全部',
               value: null
            }, {
               value: 1,
               label: '已报检'
            }, {
               value: 0,
               label: '未报检'
            }],
            radioValue: null,
            inspectionTable: [],
            currentPage: 1,
            pageSize: 10,
            total: 20,
            data: '',
            insertRule: {
               fromDate: [{
                  required: true,
                  message: '请选择来料日期',
                  trigger: 'blur'
               }],
               supplierName: [{
                  required: true,
                  message: '请输入供应商名称',
                  trigger: 'blur'
               }],
               mName: [{
                  required: true,
                  message: '请选择物料名称',
                  trigger: 'blur'
               }],
               mCode: [{
                  required: true,
                  message: '请选择物料',
                  trigger: 'blur'
               }],
               specificationsNumber: [{
                  required: true,
                  message: '请选择规格型号',
                  trigger: 'blur'
               }],
               unit: [{
                  required: true,
                  message: '请输入单位',
                  trigger: 'blur'
               }],
               num: [{
                  required: true,
                  message: '请输入报检数量',
                  trigger: 'blur'
               }]
            },
            materialList: []
         }
      },
      created() {
         this.getRawMaterialList()
      },
      mounted() {
         this.getMaterielName();
      },
      watch:{
         addReportDialog(newVal){
            if(newVal === false){
               this.resetForm("addInspectionForm");
            }
         }
      },
      methods: {
         handleChange() {

         },
         async deleteMaterialFun(row, index) {
            let formData = new FormData();
            formData.append("deleteId", row.id)
            await deleteMaterial(formData).then(() => {
               this.inspectionTable.splice(index, 1);
               this.$message.success("删除成功");
            }).catch(error => {
               this.$message.error(error.message);
            });
         },
         resetForm(formName) {
            this.addInspectionForm.inspectionDate = [],
            this.$refs[formName].resetFields();
            this.addReportDialog = false
         },
         removeFun(row, index) {
            this.$confirm('确认删除该数据吗?', '提示', {
               confirmButtonText: '确定',
               cancelButtonText: '取消',
               type: 'warning'
            }).then(() => {
               this.deleteMaterialFun(row, index);
            }).catch(() => {});
         },
         checkSelect(row) {
            if (row.type === 1) {
               return false;
            } else {
               return true;
            }
         },
         handleSelectionChange(val) {
            if (val.length > 1) {
               let data = val.pop();
               this.$refs.inspectionTable.clearSelection();
               this.$refs.inspectionTable.toggleRowSelection(data);
               this.checkData = new Array(data);
            }else{
               this.checkData = val;
            }
         },
         //生成报检单按钮
         addReportBtn() {
            if (this.checkData.length < 1) {
               this.$message.error("请选择一条数据!");
            } else {
               if (this.checkData.length > 1) {
                  this.$message.error("最多选择一条数据!");
               } else {
                     let mcode = this.checkData[0].materialCoding;
                     let name = this.checkData[0].materialName;
                     let speId = this.checkData[0].specificationsId;
                     this.getChooseVersionFun(mcode,name,speId);
                  this.addReportDialog = true;
               }
            }
         },
         changeVersionFun(){
            let mCode = this.checkData[0].materialCoding;
            let name = this.checkData[0].materialName;
            let specifications = this.checkData[0].specificationsModels;
            let version = this.addInspectionForm.version;
            this.getProByVersion(mCode,name,specifications,version);
         },
         //获取版本下的标准库数据
         async getProByVersion(mCode,name,specifications,version){
            var vm = this;
            await lookProByVer({
               mcode : mCode,
               name : name,
               specifications : specifications,
               version: version
            }).then((res)=>{
               var arr = res.data;
               for(var i=0;i<arr.length;i++){
                  arr[i].id = "0" + i;
               }
               vm.standardLibraryData = arr;
            })
				
         },
         //获取版本列表
         async getChooseVersionFun(mCode,name,specifications){
            var vm = this;
            this.chooseVersion = [];
            await getChooseVersion({
            mcode : mCode,
            name : name,
            specifications : specifications
            }).then((res)=>{
               vm.getProByVersion(mCode,name,specifications,res.data[0])
               for(let i=0;i<res.data.length;i++){
                  vm.chooseVersion.push({
                  value: res.data[i],
                  label: "V"+res.data[i]
                  });
               }
               vm.addInspectionForm.version = res.data[0];
            });
         },
         //生成报检单确认按钮
         confirmBtn(formName) {
            this.$refs[formName].validate((valid=>{
            if(valid){
               let dateArr = this.addInspectionForm.inspectionDate;
               //添加报检单
               let val = this.checkData[0];
               let obj = {
               "endTime": dateArr[1],
               "experiment": "",
               "formTime": val.createTime,
               "id": val.id,
               "mcode": val.materialCoding,
               "name": val.materialName,
               "num": val.quantity,
               "specifications": val.specificationsModels,
               "specificationsId": val.specificationsId,
               "startTime": dateArr[0],
               "supplier": val.supplierName,
               "type": val.type,
               "unit": val.unit,
               "version": this.addInspectionForm.version
               }
               this.createReport(obj);
               this.addReportDialog = false;
            }
            }));
         },
         //生成报检单
         async createReport(param) {
            await addInspect(param).then(res =>{
               this.search();
               this.$message.success('报检成功')
               this.$router.push(`/experiment/Viewdetails/${res.data}`)
            }).catch(error =>{
               this.$message.error('报检失败')
            });
         },
         // 获取分页列表数据
         async getRawMaterialList() {
            const res = await getRawMaterialList({
               pageNo: this.currentPage,
               pageSize: this.pageSize
            })
            this.inspectionTable = res.data.row
            this.data = res.data.row
            this.total = res.data.total
         },
         async search() {
            this.radioValue = this.searchData.state
            const res = await getRawMaterialList({
               type: this.searchData.state,
               createTime: this.searchData.date,
               materialCoding: this.searchData.code,
               materialName: this.searchData.name,
               pageNo: this.currentPage,
               pageSize: this.pageSize
            })
            this.inspectionTable = res.data.row
            this.data = res.data.row
            this.total = res.data.total
         },
         reset() {
            this.searchData = {
               code: '',
               name: '',
               state: '',
               date: ''
            }
            this.getRawMaterialList()
         },
         // 每页条数改变时触发 选择一页显示多少行
         handleSizeChange(val) {
            this.pageSize = val
            this.getRawMaterialList({
               pageNo: this.currentPage,
               pageSize: this.pageSize
            })
         },
         // 当前页改变时触发 跳转其他页
         handleCurrentChange(val) {
            this.currentPage = val
            this.getRawMaterialList({
               pageNo: this.currentPage,
               pageSize: this.pageSize
            })
         },
         insert() {
            this.$refs['addMaterialForm'].validate((valid) => {
               if (valid) {
                  console.log(this.childrenOptions);
                  console.log(this.insertData);
                  let f=this.childrenOptions.filter(item=>{
                     return item.Id===this.insertData.specificationsNumber[0]
                  })[0]
                  console.log(f);
                  let fatherName=f.Name;
                  let c=f.children.filter(item=>{
                     return item.Id===this.insertData.specificationsNumber[1]
                  })[0]
                  let sonName=c.Name
                  let specificationsId=c.Id;
                  var str = {
                     "dateSurvey": this.insertData.fromDate,
                     "materialCoding": this.insertData.mCode,
                     "materialName": this.insertData.mName,
                     "quantity": this.insertData.num,
                     "specificationsModels": fatherName+ '-' + sonName,
                     "specificationsId": specificationsId,	
                     "supplierName": this.insertData.supplierName,
                     "type": 0,
                     "unit": this.insertData.unit
                  }
                  this.materialList.forEach(a => {
                     if (a.id == str.materialName) {
                        str.materialName = a.name
                     }
                  })
                  addMaterial(str).then(res => {
                     this.$message.success('添加成功')
                     this.addReportVisible = false
                     this.getRawMaterialList()
                  })
               } else {
                  return false;
               }
            });
         },
         getMaterielName() {
            getMaterielName().then(res => {
               this.materialList = res.data
            })
         },
         getSpecification(val) {
            this.materialList.forEach(a => {
               if (a.id == val) {
                  this.insertData.mCode = a.code
               }
            })
            getSpecification({
               materialId: val
            }).then(res => {
               this.childrenOptions = JSON.parse(JSON.stringify(res.data).replaceAll('specifications', '').replaceAll(
                  'model', ''))
            })
         }
      }
   }
</script>

<style scoped>
<style scoped lang="scss">
   .content-main {
      height: 100%;

.top-bar{
    margin: -25px -15px;
    background: #fff;
    display: flex;
    justify-content: space-between;
    padding: 5px 24px 0px 24px;
    .sermargin{
        margin-right: 60px;
    }
}
.rightBtn{
    background-color: rgb(1, 102, 226);
}
.library-table{
      background-color: #fff;
      flex: 1;
      margin: 0px -15px;
      margin-top: 40px;
      display: flex;
      flex-direction: column;
      .table-header{
        padding: 20px;
        display: flex;
        justify-content: space-between;
        .el-form-item{
          margin-bottom: 30px !important;
      .top-bar {
         margin: -25px -15px;
         background: #fff;
         display: flex;
         justify-content: space-between;
         padding: 24px 24px 0px 24px;

         .sermargin {
            margin-right: 60px;
         }
      }

      .rightBtn {
         background-color: rgb(1, 102, 226);
      }

      .library-table {
         background-color: #fff;
         flex: 1;
         margin: 0px -15px;
         margin-top: 40px;
         display: flex;
         flex-direction: column;

         .table-header {
        width: 100%;
        height: 70px;
            padding: 20px;
            display: flex;
            justify-content: space-between;
        .generateInsp{
          position: relative;
          left: 92%;
        }
      }
      .table-box{
          padding: 0px 20px;
          margin-top: 0px;
          flex: 1;
          background: #fff;
          /* padding: 20px 20px 10px 20px; */
          display: flex;
          flex-direction: column;
          .el-table {
            flex: 1;
          }
          >div:nth-child(2){
            display: flex;
            justify-content: end;
            margin: 10px 0;
          }
      }
    }
.checked {
  color: green;
}
            .el-form-item {
               margin-bottom: 30px !important;
            }
         }

.unchecked {
  color: red;
}
         .table-box {
            padding: 0px 20px;
            margin-top: 0px;
            flex: 1;
            background: #fff;
            /* padding: 20px 20px 10px 20px; */
            display: flex;
            flex-direction: column;

</style>
            .el-table {
               flex: 1;
            }

            >div:nth-child(2) {
               display: flex;
               justify-content: end;
               margin: 10px 0;
            }
         }
      }

      .checked {
         color: green;
      }

      .unchecked {
         color: red;
      }

      .newPage {
         margin: -25px -15px;

         .inspectionForm {
            background-color: #fff;

            .formwrapper {
               margin-left: 80px;
               padding: 10px 0px;
            }
         }

         .inspectionProject {
            margin: 10px 0px;

            .header {
               display: flex;
               justify-content: space-between;
               padding-top: -3px;
               padding-bottom: 3px;
            }

            .el-table {
               padding: 10px 10px;
               height: 65vh;
               overflow-y: auto;
            }
         }
      }
   }
</style>