Merge branch 'master' of http://192.168.110.209:9001/r/lims-before

yuyu

2023-08-30 22a0512510da46df94afd7f7733cdf6c6bc38518

Merge branch 'master' of http://192.168.110.209:9001/r/lims-before

 .env.development

@@ -2,4 +2,4 @@
ENV = 'development'

# base api
VUE_APP_BASE_API =  'http://192.168.110.107:1234/'
VUE_APP_BASE_API =  'http://localhost:1234/'

 src/api/inspection/commisioninspection.js

@@ -25,6 +25,14 @@
  })

}
//
export function getContractsSampleInfo(params){
  return request({
    url: 'link-basic/getContractsSampleInfo',
    method: 'get',
    params
  })
}
//规格型号
export function getModelSpecification(params){
  return request({
@@ -57,7 +65,6 @@
  })
}


export function isIfViewUUID(params){
  return request({
    url: '/link-basic/isIfViewUUID',
@@ -72,4 +79,12 @@
    method: 'get',
        params
  })
}
}

export function delLink(params){
  return request({
    url: '/link-basic-table/delLink',
    method: 'post',
        params
  })
}

 src/api/inspection/rawmaterial.js

@@ -8,3 +8,19 @@
    params
  })
}

export function addInspect(data){
  return request({
    url: '/inspection/addInspect',
    method: 'post',
    data
  })
}

export function selectInspectsListById(params){
  return request({
    url: '/inspection/selectInspectsListById',
    method: 'get',
    params
  })
}

 src/layout/components/Sidebar/SidebarItem.vue

@@ -2,7 +2,6 @@
  <div v-if="!item.hidden">
    <template v-if="hasOneShowingChild(item.children,item) && (!onlyOneChild.children||onlyOneChild.noShowingChildren)&&!item.alwaysShow">
      <app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path)">

        <el-menu-item v-if="onlyOneChild.meta.show==false ?onlyOneChild.meta.show: true" :index="resolvePath(onlyOneChild.path)" :class="{'submenu-title-noDropdown':!isNest}">
          <item :show="onlyOneChild.meta.show" :icon="onlyOneChild.meta.icon||(item.meta&&item.meta.icon)" :title="onlyOneChild.meta.title" />
          <span v-if="onlyOneChild.meta.title==='主页'">主页</span>

 src/views/CNAS/satisfactionSurveys/index.vue

@@ -224,7 +224,7 @@
      otherSupplements: "无",
      improvementRequirements: "无",
      dialogVisible2: false,
      path: 'http://192.168.110.254:1234/cnasSatisfactionSurvey/uploadFile',
      path: 'http://localhost:1234/cnasSatisfactionSurvey/uploadFile',
      ruleForm: {
        surveyDate: '',
        userUnit: '',
@@ -263,7 +263,7 @@
    }
  },
  created() {

      // this.path=process.env.VUE_APP_BASE_API+"cnasSatisfactionSurvey/uploadFile"
  },
  mounted() {
    this.getData()

 src/views/experiment/inspectionApplication/Viewdetails/index.vue

@@ -1,7 +1,7 @@
<template>
<div> 
    <div style="overflow: hidden;">
        <el-card style="margin: 10px;" v-model="searchData" >
        <el-card style="margin: 10px;" >
        <div slot="header" class="clearfix">
            <span>
                <i slot="prefix" class="el-icon-s-home" />               
@@ -116,7 +116,7 @@
                    <el-table-column prop="userName" label="经验人">
                        <template slot-scope="scope">
                            <el-select v-model="value" size="small" slot="append" style="width: 220px;">
                            <el-option v-for="item in ZERENren" :key="item.id" :label="item.name"  :value="item.name"></el-option>
                            <el-option v-for="(item,indxe) in ZERENren" :key="indxe" :label="item.name"  :value="item.name"></el-option>
                            </el-select>
                        </template>
                    </el-table-column>
@@ -125,7 +125,7 @@
                        label="实验设备">
                        <template slot-scope="scope">
                            <el-select v-model="SHEbei" size="small" slot="append" style="width: 220px;">
                            <el-option v-for="item in getDevices" :key="item.id" :label="item.name"></el-option>
                            <el-option v-for="(item,index) in getDevices" :key="index" :label="item.name"></el-option>
                            </el-select>
                        </template>
                    </el-table-column>
@@ -141,10 +141,20 @@
export default {
    data(){
        return {
            searchData:{ },
            searchData:{
                formTime: '',
                supplier: '',
                code: '',
                name: '',
                specifications: '',
                unit: '',
                num: '',
                endTime: '',
                userName: '',
            },
            insProducts:[],
            value:'',
            SHEbei:'',
            SHEbei:[],
            aaa:{},
            ZERENren:[],
            // getDevices:[]

 src/views/experiment/inspectionApplication/index.vue

@@ -517,8 +517,6 @@
        watch: {
            $route: {
                handler(val, oldval) {
                    console.log(val) // 新路由信息
                    console.log(oldval) // 老路由信息
                },
                // 深度观察监听
                deep: true

 src/views/inspectionManagement/commissionInspection/addCommision.vue

@@ -21,13 +21,11 @@
                        :data="detectionInfo" style="width: 100%;margin-bottom: 20px;">
                        <el-table-column type="index" label="序号" min-width="10%" />
                        <el-table-column prop="sampleNumber" label="样品编号" min-width="8%" />

                        <el-table-column prop="sampleName" label="样品名称" min-width="10%" />

                        <el-table-column prop="specificationsModels" label="规格型号" min-width="10%" />
                        <el-table-column prop="unit" label="单位" min-width="8%" />
                        <el-table-column prop="samplesNumber" label="数量" min-width="8%" />
                        <el-table-column prop="addway" label="添加方式" min-width="8%">
                        <!-- <el-table-column prop="addway" label="添加方式" min-width="8%">
                            <template slot-scope="scope">
                                <div v-if="scope.row.addway === 0">
                                    <el-tag type="success" disable-transitions>扫描</el-tag>
@@ -37,7 +35,7 @@
                                </div>
                                <div v-else></div>
                            </template>
                        </el-table-column>
                        </el-table-column> -->
                        <el-table-column prop="remarks" label="备注" min-width="8%" />
                        <el-table-column label="操作" min-width="8%">
                            <template slot-scope="scope">
@@ -102,8 +100,8 @@
                                <el-col :span="5">
                                    <el-form-item label="送样方式：">
                                        <el-select style="width: 200px;" v-model="infoForm.way" size="small" placeholder="送样">
                                            <el-option v-for="options in sampleDeliveryMode" :key="options.key"
                                                :value="options.value">{{ options.value }}</el-option>
                                            <el-option v-for="options in sampleDeliveryMode" :key="options.key" :value="options.key"
                                                :label="options.value">{{ options.value }}</el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
@@ -229,7 +227,8 @@
        getlink,
        addInspection,
        isIfViewUUID,
        getProductList
        getProductList,
        getContractsSampleInfo
    } from '@/api/inspection/commisioninspection'
    export default {
        data() {
@@ -274,17 +273,8 @@
                    key: '4',
                    label: '绝缘部分交流耐压试验'
                }],
                sampleoptions: [{
                    key: '1',
                    value: '选项1'
                }, {
                    key: '2',
                    value: '选项2'
                }],
                samplecodeoptions: [{
                    key: '1',
                    value: ''
                }],
                sampleoptions: [],
                samplecodeoptions: [],
                model_spe_options: [],
                model_sta_options: [],
                model_options: [],
@@ -325,6 +315,7 @@
            this.viewId = this.$route.params.viewId
            this.$store.commit('settings/SAVE_LINK', this.viewId)
            this.getlink(this.$route.params.viewId)
            this.getContractsSampleInfo(this.$route.params.viewId)
        },
        mounted() {
            this.getSampleName()
@@ -342,8 +333,16 @@
                    if (!res.data) {
                        this.$message.error('当前链接不在有效期内,系统自动关闭')
                        this.$router.push('/404')
                    } else {
                        this.getContractsSampleInfo()
                    }
                })
            },
            async getContractsSampleInfo(viewId) {
                let res = await getContractsSampleInfo({
                    viewId
                })
                console.log(res.data);
            },
            async getSampleName() {
                const res = await getSampleName()
@@ -373,8 +372,6 @@
                for (let i = 1; i < this.addPointerForm.experiment.length; i++) {
                    exper += ',' + this.addPointerForm.experiment[i]
                }

                // console.log(exper)
                this.addPointerForm.experiment = exper
                let tmp = this.addPointerForm
                this.detectionInfo.push(tmp)
@@ -414,7 +411,7 @@
                this.infoForm.commisioncode = res.data
                if (res.data) {
                    this.$message({
                        message: '恭喜你!',
                        message: '添加成功!',
                        type: 'success'
                    })
                    this.showDetail = true
@@ -447,6 +444,29 @@
                        return item.name
                    })
                })
            },
            getContractsSampleInfo() {
                getContractsSampleInfo({
                    viewId: this.viewId
                }).then(res => {
                    if (res.data == null) return
                    this.infoForm = {
                        commisioncode: res.data.entrustCoding,
                        deadline: res.data.completionDeadline,
                        address: res.data.contactAddress,
                        tel: res.data.contactNumber,
                        contacter: res.data.contacts,
                        other: res.data.entrustRemarks,
                        department: res.data.entrusted,
                        time: res.data.inspectionTime,
                        detectionInfo: res.data.linkDetectionList,
                        num: res.data.reportNumber,
                        way: '' + res.data.sampleDeliveryMode,
                        sendertel: res.data.sampleDeliveryPhone,
                        sender: res.data.sampleSender
                    }
                    this.detectionInfo = res.data.linkDetectionList
                })
            }
        }
    }

 src/views/inspectionManagement/commissionInspection/index.vue

@@ -68,10 +68,10 @@
                            <el-table-column prop="samples_number" label="样品数量" min-width="8%" />
                            <el-table-column prop="sample_name" label="样品名称" min-width="8%" />
                            <el-table-column prop="specifications_models" label="规格型号" min-width="12%" />
                            <el-table-column prop="dateSurvey" label="送样时间" min-width="8%" />
                            <el-table-column prop="inspectionTime" label="送样时间" min-width="8%" />
                            <el-table-column prop="completionDeadline" label="完成期限" min-width="8%" />
                            <el-table-column prop="contacts" label="委托编制人" min-width="8%" />
                            <el-table-column prop="inspectionTime" label="检验日期" min-width="8%" />
                            <el-table-column prop="insTime" label="检验日期" min-width="8%" />
                            <el-table-column prop="inspection_status" label="状态" min-width="8%">
                                <template slot-scope="scope">
                                    <div v-if="scope.row.inspection_status === 0">
@@ -133,7 +133,8 @@
    import {
        getCommisionList,
        getViewUUID,
        selectViewUUID
        selectViewUUID,
        delLink
    } from '@/api/inspection/commisioninspection'
    export default {
        data() {
@@ -191,7 +192,6 @@
        },
        updated() {
            if (this.$router.currentRoute.name === 'AddCommision') {
                // console.log(this.$router.currentRoute.name)
                this.showDetail = true
            }
        },
@@ -203,7 +203,6 @@
                })
                this.commisionTable = res.data.row
                this.total = res.data.total
                // console.log(res)
                // 获取所有的委托单位名称
                const allDepartmentNames = [...new Set(this.commisionTable.map(item => item.entrusted))]
                // 将allDepartmentNames转换为options需要的格式
@@ -235,7 +234,6 @@
                        inspectionStatus: this.radioValue
                    })
                }
                // console.log(res)
                this.commisionTable = res.data.row
                this.total = res.data.total
            },
@@ -252,7 +250,6 @@
            },
            async radioclick() {
                // 处理点击radio的时间
                console.log('radioValue', this.radioValue)
                if (this.radioValue === 0) {
                    this.getCommisionList()
                } else {
@@ -261,7 +258,6 @@
                        pageSize: this.pageSize,
                        inspectionStatus: this.radioValue
                    })
                    // console.log(res)
                    this.commisionTable = res.data.row
                    this.total = res.data.total
                }
@@ -269,7 +265,6 @@
            },
            // 每页条数改变时触发 选择一页显示多少行
            async handleSizeChange(val) {
                // console.log(`每页 ${val} 条`)
                this.currentPage = 1
                this.pageSize = val
                if (this.radioValue === 0) {
@@ -286,7 +281,6 @@
            },
            // 当前页改变时触发 跳转其他页
            async handleCurrentChange(val) {
                // console.log(`当前页: ${val}`)
                this.currentPage = val
                if (this.radioValue === 0) {
                    this.getCommisionList()
@@ -329,13 +323,18 @@
                }
            },
            handleClick(row){
                console.log(row);
                delLink({
                    id: row.id
                }).then(res=>{
                    this.$message.success('删除成功')
                    this.getCommisionList()
                })
            }
        }
    }
</script>

<style scoped>
<style scoped lang="scss">
    .top-bar {
        margin: -25px -15px;
        background: #fff;

 src/views/inspectionManagement/reportForInspection/index.vue

@@ -1,525 +1,513 @@
<template>
    <div class="content-main">
      <div class="rawPage" v-if="!showNewPage">
        <div class="top-bar">
            <el-form ref="form" :inline="true" :model="searchData">
            <el-form-item label="材料编码:" position="left" 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" @click="search">查询</el-button>
              <el-button type="primary" plain @click="reset">重置</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" @change="radioclick">
                <el-radio-button v-for="option in radioOptions" :key="option.value" :label="option.value">{{ option.label }}</el-radio-button>
              </el-radio-group>
            </div>
            <div class="generateInsp">
              <el-button @click="showNewPage = true" 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"
                min-width="10%"
              /> 
              <el-table-column
                type="index"
                label="序号"
                min-width="8%"
              />
              <el-table-column
                prop="createTime"
                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
                prop="surveyor"
                label="检验人"
                min-width="8%"
              />
              <el-table-column
                prop="dateSurvey"
                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>
            <!-- 分页器 -->
            <div>
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[5, 10, 15, 20]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
              </el-pagination>
            </div>
          </div>
        </div>
      </div>
    <div class="content-main">
        <div class="rawPage" v-if="!showNewPage">
            <div class="top-bar">
                <el-form ref="form" :inline="true" :model="searchData">
                    <el-form-item label="材料编码:" position="left" 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" @click="search">查询</el-button>
                        <el-button type="primary" plain @click="reset">重置</el-button>
                        <el-button 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 v-model="insertData" label-position="left" label-width="80px">
                    <el-form-item label="标准类型">
                        <el-input v-model="insertData.materialName" />
                    </el-form-item>
                    <el-form-item label="物料名称">
                        <el-input v-model="insertData.materialName" />
                    </el-form-item>
                    <el-form-item label="执行标准">
                        <el-input v-model="insertData.standardName" />
                    </el-form-item>
                    <el-form-item label="规格型号">
                        <el-input v-model="insertData.specificationsName" />
                    </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="search-bar">
                        <el-radio-group v-model="radioValue" @change="radioclick">
                            <el-radio-button v-for="option in radioOptions" :key="option.value"
                                :label="option.value">{{ option.label }}</el-radio-button>
                        </el-radio-group>
                    </div>
                    <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 class="newPage" v-if="showNewPage">
        <!-- 新增页面 -->
        <div class="inspectionForm">
          <el-form :model="inspectionForm" ref="inspectionForm" label-position="right" label-width="100px" size="mini" >
            <div class="formwrapper">
              <el-row>
                <el-col  :span="8">
                  <el-form-item label="来料日期：">
                    <el-input  style="width: 180px;" :value="inspectionForm.createTime" disabled autocomplete="off" />  
                  </el-form-item>
                </el-col>
                <el-col  :span="8">
                  <el-form-item label="供应商名称：">
                    <el-input style="width: 180px;" :value="inspectionForm.supplier_name" disabled autocomplete="off" />                  </el-form-item>
                </el-col>
                <el-col  :span="8">
                  <el-form-item label="样品编号：">
                    <el-input style="width: 180px;" :value="inspectionForm.materialCoding" disabled autocomplete="off" />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row >
                <el-col  :span="8">
                  <el-form-item label="样品名称：" >
                    <el-input style="width: 180px;" :value="inspectionForm.materialName" disabled autocomplete="off" />
                  </el-form-item>
                </el-col>
                <el-col  :span="8">
                  <el-form-item label="规格型号：">
                    <el-input style="width: 180px;" :value="inspectionForm.specificationsModels" disabled autocomplete="off" />                       
                  </el-form-item>
                </el-col>
                <el-col  :span="8">
                  <el-form-item label="单位：">
                    <el-input style="width: 180px;" :value="inspectionForm.unit" disabled autocomplete="off" />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row >
                <el-col  :span="8">
                  <el-form-item label="数量：" >
                    <el-input style="width: 180px;" :value="inspectionForm.quantity" disabled autocomplete="off" />                       
                  </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="报检日期：" >
                      <el-input style="width: 180px;" :value="inspectionForm.dateSurvey" disabled autocomplete="off" />                       
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="报检人：">
                        <el-input style="width: 180px;" :value="inspectionForm.surveyor" disabled autocomplete="off" />
                    </el-form-item>
                  </el-col>
                </el-row>
            </div>
            </el-form>
        </div>
        <div class="inspectionProject">
          <div class="header">
            <span style="font-size: 14px">检验项目</span>
            <div>
            <el-button  type="primary" plain size="mini">保存</el-button>
            <el-button @click="showNewPage = false" type="primary" plain size="mini" icon="el-icon-back">返回</el-button>
          </div>
          </div>
            <el-table
              :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="inspectionItems">
            <el-table-column type="index" label="序号" width="60"></el-table-column>
            <el-table-column prop="project" label="项目" width="250"></el-table-column>
            <el-table-column prop="unit" label="单位" width="125"></el-table-column>
            <el-table-column prop="standardVal" label="标准值" width="125"></el-table-column>
            <el-table-column prop="controlVal" label="内测值" width="125"></el-table-column>
            <el-table-column prop="detectionVal" label="检验值" width="125"></el-table-column>
            <el-table-column prop="checker" label="检验人">
              <template slot-scope="scope">
                <el-select v-model="scope.row.checker" size="small" slot="append" style="width: 260px;">
                    <el-option v-for="item in checkeroptions" :key="item.value" :label="item.label">{{ item.label }}</el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="device" label="试验设备">
                <template slot-scope="scope">
                <el-select v-model="scope.row.device" size="small" slot="append" style="width: 260px;">
                    <el-option v-for="item in deviceoptions" :key="item.value" :label="item.label">{{ item.label }}</el-option>
                </el-select>
            </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
  </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%" @selection-change="handleSelectionChange">
                        <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="createTime" 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 prop="surveyor" label="检验人" min-width="8%" />
                        <el-table-column prop="dateSurvey" 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)">删除</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <!-- 分页器 -->
                    <div>
                        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                            :current-page="currentPage" :page-sizes="[5, 10, 15, 20]" :page-size="pageSize"
                            layout="total, sizes, prev, pager, next, jumper" :total="total">
                        </el-pagination>
                    </div>
                </div>
            </div>
        </div>

        <!-- 生成报检单 -->
        <div class="newPage" v-if="showNewPage">
            <!-- 新增页面 -->
            <div class="inspectionForm">
                <el-form :model="inspectionForm" ref="inspectionForm" label-position="right" label-width="100px" size="mini">
                    <div class="formwrapper">
                        <el-row>
                            <el-col :span="8">
                                <el-form-item label="来料日期：">
                                    <el-input style="width: 180px;" :value="inspectionForm.formTime" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="供应商名称：">
                                    <el-input style="width: 180px;" :value="inspectionForm.supplier" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="样品编号：">
                                    <el-input style="width: 180px;" :value="inspectionForm.code" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="8">
                                <el-form-item label="样品名称：">
                                    <el-input style="width: 180px;" :value="inspectionForm.name" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="规格型号：">
                                    <el-input style="width: 180px;" :value="inspectionForm.specifications" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="单位：">
                                    <el-input style="width: 180px;" :value="inspectionForm.unit" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="8">
                                <el-form-item label="数量：">
                                    <el-input style="width: 180px;" :value="inspectionForm.num" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="报检日期：">
                                    <el-input style="width: 180px;" :value="inspectionForm.endTime" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="报检人：">
                                    <el-input style="width: 180px;" :value="inspectionForm.userName" disabled autocomplete="off" />
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </div>
                </el-form>
            </div>
            <div class="inspectionProject">
                <div class="header">
                    <span style="font-size: 14px">检验项目</span>
                    <div>
                        <!-- <el-button  type="primary" plain size="mini">保存</el-button> -->
                        <el-button @click="showNewPage = false" type="primary" plain size="mini" icon="el-icon-back">返回</el-button>
                    </div>
                </div>
                <el-table :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="inspectionItems">
                    <el-table-column type="index" label="序号" width="60"></el-table-column>
                    <el-table-column prop="name" label="项目" width="250"></el-table-column>
                    <el-table-column prop="unit" label="单位" width="125"></el-table-column>
                    <el-table-column prop="required" label="标准值" width="125"></el-table-column>
                    <el-table-column prop="internal" label="内测值" width="125"></el-table-column>
                    <el-table-column prop="testValue" label="检验值" width="125"></el-table-column>
                    <el-table-column prop="userName" label="检验人">
                        <template slot-scope="scope">
                            <el-select v-model="scope.row.checker" size="small" slot="append" style="width: 260px;">
                                <el-option v-for="(item,index) in checkeroptions" :key="index" :value="item.value"
                                    :label="item.label">{{ item.label }}</el-option>
                            </el-select>
                        </template>
                    </el-table-column>
                    <el-table-column prop="device" label="试验设备">
                        <template slot-scope="scope">
                            <el-select v-model="scope.row.device" size="small" slot="append" style="width: 260px;">
                                <el-option v-for="(item,index) in deviceoptions" :key="index" :value="item.value"
                                    :label="item.label">{{ item.label }}</el-option>
                            </el-select>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </div>
    </div>
</template>

<script>
import { getRawMaterialList } from '@/api/inspection/rawmaterial'
export default {
  data() {
    return {
      form: [],
      searchData: {
        code: '',
        name: '',
        state: '',
        date: ''
      },
      options: [{
        value: 0,
        label: '全部'
      }, {
        value: 1,
        label: '已检验'
      }, {
        value: 2,
        label: '待检验'
      }],
      deviceoptions:[{
        value: 0,
        label: '拉力机'
      },{
        value: 1,
        label: '拖拉机'
      }],
      checkeroptions:[{
        value: 0,
        label: '黄小明'
      },{
        value: 1,
        label: '张三'
      }],
      radioOptions:[{
        label: '全部',
        value: 0
      },{
        value: 1,
        label: '已检验'
      },{
        value: 2,
        label: '待检验'
      }],
      radioValue: 0,
      inspectionTable: [{
        createTime: '2023-07-28',
        supplier_name: '国网山东省电力有限公司',
        materialCoding: 'BP214274',
        materialName: '铝包钢绞线',
        specificationsModels: 'JLHA/G1A-185/30-26/7',
        unit: '吨',
        quantity: 21,
        dateSurvey: '2023-08-02',
        surveyor: '黄小明',
        inspectionDate: '2023-12-09',
        condition: 1
      }],
      currentPage: 1,
      pageSize: 5,
      total:20,
      data: '',
      showNewPage: false,
      inspectionForm:{
        createTime: '2023-07-28',
        supplier_name: '国网山东省电力有限公司',
        materialCoding: 'BP214274',
        materialName: '铝包钢绞线',
        specificationsModels: 'JLHA/G1A-185/30-26/7',
        unit: '吨',
        quantity: 21,
        dateSurvey: '2023-08-02',
        surveyor: '黄小明',
        inspectionDate: '2023-12-09',
      },
      inspectionItems:[{
        project:'导线外径',
        unit: 'mm',
        standardVal: '30.0',
        controlVal: '30.0',
        detectionVal: '30.0',
        device:'',
        checker: '',
      },{
        project:'导线外径',
        unit: 'mm',
        standardVal: '30.0',
        controlVal: '30.0',
        detectionVal: '30.0',
        device:'',
        checker: ''
      },{
        project:'导线外径',
        unit: 'mm',
        standardVal: '30.0',
        controlVal: '30.0',
        detectionVal: '30.0',
        device:'',
        checker: ''
      },{
        project:'导线外径',
        unit: 'mm',
        standardVal: '30.0',
        controlVal: '30.0',
        detectionVal: '30.0',
        device:'',
        checker: ''
      },{
        project:'导线外径',
        unit: 'mm',
        standardVal: '30.0',
        controlVal: '30.0',
        detectionVal: '30.0',
        device:'',
        checker: ''
      },{
        project:'导线外径',
        unit: 'mm',
        standardVal: '30.0',
        controlVal: '30.0',
        detectionVal: '30.0',
        device:'',
        checker: ''
      }]
    }
  },
  created(){
    this.getRawMaterialList()
  },
  methods: {
    // 获取分页列表数据
    async getRawMaterialList(){
      const res = await getRawMaterialList({pageNo: this.currentPage,pageSize:this.pageSize})
      // console.log(res)
      this.inspectionTable = res.data.row
      this.data = res.data.row
      console.log(res.data.row);
      this.total = res.data.total
    },
    async search(){
      this.radioValue = this.searchData.state
      const res = await getRawMaterialList({condition: this.searchData.state,
        createTime:this.searchData.date,
        materialCoding:this.searchData.code,
        materialName: this.searchData.name,
        pageNo: this.currentPage,
        pageSize: this.pageSize
      })
      // console.log(res)
      this.inspectionTable = res.data.row
      this.data = res.data.row
      this.total = res.data.total
    },
    reset(){
      this.searchData = {
        code: '',
        name: '',
        state: '',
        date: ''
      }
      this.getRawMaterialList()
    },
    radioclick(){
      this.searchData.state = this.radioValue
      // console.log(this.radioValue)
      this.inspectionTable = this.data.filter((item)=>{
        return item.condition === this.radioValue
      })
      if(this.radioValue === 0){
        this.inspectionTable = this.data
      }
      this.total = this.inspectionTable.length
    },
    // 每页条数改变时触发 选择一页显示多少行
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      this.pageSize = val
      this.getRawMaterialList({pageNo: this.currentPage,pageSize:this.pageSize})
    },
    // 当前页改变时触发 跳转其他页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`)
      this.currentPage = val
      this.getRawMaterialList({pageNo: this.currentPage,pageSize:this.pageSize})
    }
  }
}
    import {
        getRawMaterialList,
        addInspect,
        selectInspectsListById
    } from '@/api/inspection/rawmaterial'
    export default {
        data() {
            return {
                insertData: {

                },
                addReportVisible: false,
                checked: false,
                resultData: {},
                checkData: [],
                form: [],
                searchData: {
                    code: '',
                    name: '',
                    state: '',
                    date: ''
                },
                options: [{
                    value: 0,
                    label: '全部'
                }, {
                    value: 1,
                    label: '已检验'
                }, {
                    value: 2,
                    label: '待检验'
                }],
                deviceoptions: [{
                    value: 0,
                    label: '拉力机'
                }, {
                    value: 1,
                    label: '拖拉机'
                }],
                checkeroptions: [{
                    value: 0,
                    label: '黄小明'
                }, {
                    value: 1,
                    label: '张三'
                }],
                radioOptions: [{
                    label: '全部',
                    value: 0
                }, {
                    value: 1,
                    label: '已检验'
                }, {
                    value: 2,
                    label: '待检验'
                }],
                radioValue: 0,
                inspectionTable: [{
                    createTime: '2023-07-28',
                    supplier_name: '国网山东省电力有限公司',
                    materialCoding: 'BP214274',
                    materialName: '铝包钢绞线',
                    specificationsModels: 'JLHA/G1A-185/30-26/7',
                    unit: '吨',
                    quantity: 21,
                    dateSurvey: '2023-08-02',
                    surveyor: '黄小明',
                    inspectionDate: '2023-12-09',
                    condition: 1
                }],
                currentPage: 1,
                pageSize: 5,
                total: 20,
                data: '',
                showNewPage: false,
                inspectionForm: {},
                inspectionItems: []
            }
        },
        created() {
            this.getRawMaterialList()
        },
        methods: {
            removeFun(row) {
                this.$confirm('确认删除该数据吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                }).catch(() => {});
            },
            checkSelect(row, index) {
                if (row.type === 1) {
                    return false;
                } else {
                    return true;
                }
            },
            handleSelectionChange(val) {
                this.checkData = val;
            },
            //生成报检单按钮
            addReportBtn() {
                let arr = this.checkData;
                if (arr.length < 1) {
                    this.$message.error("请选择一条数据!");
                } else {
                    if (arr.length > 1) {
                        this.$message.error("最多选择一条数据!");
                    } else {
                        //添加报检单
                        let val = arr[0];
                        let obj = {
                            "endTime": val.dateSurvey,
                            "experiment": "",
                            "formTime": val.createTime,
                            "id": val.id,
                            "mcode": val.materialCoding,
                            "name": val.materialName,
                            "num": val.quantity,
                            "specifications": val.specificationsModels,
                            "startTime": val.inspectionDate,
                            "supplier": val.supplierName,
                            "type": val.type,
                            "unit": val.unit,
                            "version": val.version
                        }
                        this.createReport(obj);
                        this.showNewPage = true;
                    }
                }
            },
            //生成报价单
            async createReport(param) {
                await addInspect(param);
                const res2 = await selectInspectsListById({
                    id: 59
                });
                this.resultData = res2.data;
                this.inspectionForm = res2.data;
                this.inspectionItems = res2.data.insProducts;

            },
            // 获取分页列表数据
            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({
                    condition: 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()
            },
            radioclick() {
                this.searchData.state = this.radioValue
                this.inspectionTable = this.data.filter((item) => {
                    return item.condition === this.radioValue
                })
                if (this.radioValue === 0) {
                    this.inspectionTable = this.data
                }
                this.total = this.inspectionTable.length
            },
            // 每页条数改变时触发 选择一页显示多少行
            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
                })
            }
        }
    }
</script>

<style scoped>
.content-main{
  height: 100%;
  .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{
        padding: 20px;
        display: flex;
        justify-content: space-between;
        .el-form-item{
          margin-bottom: 30px !important;
        }
      }
      .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;
}
<style scoped lang="scss">
    .content-main {
        height: 100%;

.unchecked {
  color: red;
}
        .top-bar {
            margin: -25px -15px;
            background: #fff;
            display: flex;
            justify-content: space-between;
            padding: 24px 24px 0px 24px;

.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;
    }
  }
}
}
            .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;
                }
            }

            .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;
        }

        .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>

 src/views/laboratory/organizational/index.vue

@@ -12,6 +12,7 @@
        :filter-node-method="filterNode"
        ref="tree"
        @node-click="handleNodeClick"
                :expand-on-click-node="false"
      >
      </el-tree>
    </div>

 src/views/laboratory/personnel/index.vue

@@ -1,478 +1,393 @@
<template>
  <div class="personnel-main">
    <div class="page-header-search">
      <div class="search-bar">
        <el-form ref="form" :inline="true">
          <el-form-item>
            <el-input v-model="keyword" placeholder="请输入人员名称">
              <i slot="prefix" class="el-input__icon el-icon-search" />
            </el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="getData()">查询</el-button>
            <el-button type="primary" plain @click="resetData()"
              >重置</el-button
            >
            <!-- <el-button type="text">高级搜索<i class="el-icon-arrow-down el-icon--right" /></el-button> -->
          </el-form-item>
        </el-form>
      </div>
      <div class="serve-btn">
        <el-button
          type="primary"
          icon="el-icon-plus"
          @click="dialogFormVisible = true"
          >新增人员</el-button
        >

        <el-dialog
          :title="isUpdate == true ? '更新人员信息' : '新增人员'"
          :visible.sync="dialogFormVisible"
          width="30%"
        >
          <el-form :model="form" ref="form" :rules="rules">
            <el-form-item
              label="账号"
              :label-width="formLabelWidth"
              prop="account"
            >
              <el-input v-model="form.account" />
            </el-form-item>
            <el-form-item label="年龄" :label-width="formLabelWidth">
              <el-input v-model="form.age" />
            </el-form-item>
            <el-form-item
              label="邮箱"
              :label-width="formLabelWidth"
              prop="email"
            >
              <el-input v-model="form.email" />
            </el-form-item>
            <el-form-item
              label="名字"
              :label-width="formLabelWidth"
              prop="name"
            >
              <el-input v-model="form.name" />
            </el-form-item>
            <el-form-item
              label="电话"
              :label-width="formLabelWidth"
              prop="phone"
            >
              <el-input v-model="form.phone" />
            </el-form-item>

            <el-form-item
              label="部门"
              :label-width="formLabelWidth"
              required
              prop="organizationId"
            >
              <el-cascader
                style="width: 100%"
                :options="options"
                :props="myProp"
                v-model="form.organizationId"
                clearable
              ></el-cascader>
            </el-form-item>

            <el-form-item
              label="权限"
              :label-width="formLabelWidth"
              prop="roleId"
            >
              <el-select
                v-model="form.roleId"
                clearable
                style="width: 100%"
                placeholder="请选择权限"
              >
                <el-option
                  v-for="item in roleList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="submitForm()">{{
    <div class="personnel-main">
        <div class="page-header-search">
            <div class="search-bar">
                <el-form ref="form" :inline="true">
                    <el-form-item>
                        <el-input v-model="keyword" placeholder="请输入人员名称">
                            <i slot="prefix" class="el-input__icon el-icon-search" />
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="getData()">查询</el-button>
                        <el-button type="primary" plain @click="resetData()">重置</el-button>
                        <!-- <el-button type="text">高级搜索<i class="el-icon-arrow-down el-icon--right" /></el-button> -->
                    </el-form-item>
                </el-form>
            </div>
            <div class="serve-btn">
                <el-button type="primary" icon="el-icon-plus" @click="dialogFormVisible = true">新增人员</el-button>
                <el-dialog :title="isUpdate == true ? '更新人员信息' : '新增人员'" :visible.sync="dialogFormVisible" width="30%">
                    <el-form :model="form" ref="form" :rules="rules" style="padding-right: 50px;">
                        <el-form-item label="账号" :label-width="formLabelWidth" prop="account">
                            <el-input v-model="form.account" />
                        </el-form-item>
                        <el-form-item label="年龄" :label-width="formLabelWidth">
                            <el-input v-model="form.age" />
                        </el-form-item>
                        <el-form-item label="邮箱" :label-width="formLabelWidth" prop="email">
                            <el-input v-model="form.email" />
                        </el-form-item>
                        <el-form-item label="名字" :label-width="formLabelWidth" prop="name">
                            <el-input v-model="form.name" />
                        </el-form-item>
                        <el-form-item label="电话" :label-width="formLabelWidth" prop="phone">
                            <el-input v-model="form.phone" />
                        </el-form-item>
                        <el-form-item label="部门" :label-width="formLabelWidth" required prop="organizationId">
                            <el-cascader style="width: 100%" :options="options" :props="myProp" v-model="form.organizationId"
                                clearable></el-cascader>
                        </el-form-item>
                        <el-form-item label="权限" :label-width="formLabelWidth" prop="roleId">
                            <el-select v-model="form.roleId" clearable style="width: 100%" placeholder="请选择权限">
                                <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-form>
                    <div slot="footer" class="dialog-footer">
                        <el-button @click="dialogFormVisible = false">取 消</el-button>
                        <el-button type="primary" @click="submitForm()">{{
              isUpdate == true ? "更 新" : "确 定"
            }}</el-button>
          </div>
        </el-dialog>
      </div>
    </div>
    <div class="content-main">
      <div class="personner-table">
        <el-table
          ref="personnerlTable"
          height="calc(100vh - 240px)"
          border
          :cell-style="{ textAlign: 'center' }"
          :header-cell-style="{
                    </div>
                </el-dialog>
            </div>
        </div>
        <div class="content-main">
            <div class="personner-table">
                <el-table ref="personnerlTable" height="calc(100vh - 240px)" border :cell-style="{ textAlign: 'center' }"
                    :header-cell-style="{
            border: '0px',
            background: '#f5f7fa',
            color: '#606266',
            boxShadow: 'inset 0 1px 0 #ebeef5',
            textAlign: 'center',
          }"
          @filter-change="fnFilterChangeInit"
          :data="personnerlTable"
          style="width: 100%"
        >
          <el-table-column prop="username" label="角色名称" min-width="120" />
          <el-table-column prop="roleName" label="角色权限" min-width="120" />
          <el-table-column prop="age" label="年龄" min-width="150">
            <template scope="scope">
              {{
          }" @filter-change="fnFilterChangeInit" :data="personnerlTable" style="width: 100%">
                    <el-table-column prop="username" label="角色名称" min-width="120" />
                    <el-table-column prop="roleName" label="角色权限" min-width="120" />
                    <el-table-column prop="age" label="年龄" min-width="150">
                        <template scope="scope">
                            {{
                scope.row.age === "" ||
                scope.row.age === null ||
                scope.row.age == undefined
                  ? "---"
                  : scope.row.age
              }}
            </template>
          </el-table-column>
          <el-table-column prop="department" label="部门" min-width="150" />
          <el-table-column prop="createTime" label="创建时间" min-width="180" />
          <el-table-column prop="phone" label="电话" min-width="200">
            <template scope="scope">
              {{
                        </template>
                    </el-table-column>
                    <el-table-column prop="department" label="部门" min-width="150" />
                    <el-table-column prop="createTime" label="创建时间" min-width="180" />
                    <el-table-column prop="phone" label="电话" min-width="200">
                        <template scope="scope">
                            {{
                scope.row.phone === "" || scope.row.phone === undefined
                  ? "---"
                  : scope.row.phone
              }}
            </template>
          </el-table-column>
          <el-table-column prop="email" label="邮箱" min-width="200">
            <template scope="scope">
              {{
                        </template>
                    </el-table-column>
                    <el-table-column prop="email" label="邮箱" min-width="200">
                        <template scope="scope">
                            {{
                scope.row.email === "" || scope.row.email === undefined
                  ? "---"
                  : scope.row.email
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="jobState"
            label="在职状态"
            min-width="120"
            :filters="[
                        </template>
                    </el-table-column>
                    <el-table-column prop="jobState" label="在职状态" min-width="120" :filters="[
              { text: '在职', value: 1 },
              { text: '离岗', value: 0 },
            ]"
            column-key="status"
            :filter-method="filterTag"
            filter-placement="bottom-end"
          >
            <template slot-scope="scope">
              <el-tag
                :type="scope.row.jobState === 0 ? 'danger' : 'success'"
                disable-transitions
                >{{ scope.row.jobState === 0 ? "离岗" : "在职" }}</el-tag
              >
            </template>
          </el-table-column>
          <el-table-column label="操作" min-width="120">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small"
                @click="handleClick(scope.row)"
                >编辑</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <div>
          <!-- 分页器 -->
          <el-pagination
            :current-page="currentPage"
            :page-sizes="[10, 15, 20, 25]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
          />
        </div>
      </div>
    </div>
  </div>
            ]" column-key="status" :filter-method="filterTag" filter-placement="bottom-end">
                        <template slot-scope="scope">
                            <el-tag :type="scope.row.jobState === 0 ? 'danger' : 'success'"
                                disable-transitions>{{ scope.row.jobState === 0 ? "离岗" : "在职" }}</el-tag>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作" min-width="120">
                        <template slot-scope="scope">
                            <el-button type="text" size="small" @click="handleClick(scope.row)">编辑</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div>
                    <!-- 分页器 -->
                    <el-pagination :current-page="currentPage" :page-sizes="[10, 15, 20, 25]" :page-size="pageSize"
                        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
                        @current-change="handleCurrentChange" />
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { get, post, put } from "@/api/util/requestUtil";
import urlInfo from "../../../api/urlEnum/personnel.js";
import { getOrganizationalApi } from "@/api/laboratory/organizational";
export default {
  data() {
    return {
      keyword: "",
      roleList: "",
      personnerlTable: [],
      filteredpersonnerlTable: [],
      currentindex: 1,
      currentPage: 1, // 当前页码
      total: 0, // 总条数
      pageSize: 100, // 每页的数据条数
      personData: [], // 用来存放接口传过来的人员列表数据
      dialogFormVisible: false,
      form: {
        account: "",
        age: "",
        email: "",
        name: "",
        phone: "",
        organizationId: "",
        roleId: "",
      },
      myProp: {
        value: "id",
        label: "department",
        checkStrictly: true, //允许选择任意一节
      },
      formLabelWidth: "100px",
      rules: {
        account: [
          {
            required: true,
            message: "请输入账号",
            trigger: "blur",
          },
        ],
        name: [
          {
            required: true,
            message: "请输入名字",
            trigger: "blur",
          },
        ],
        phone: [
          // { required: true, message: '请输入11位电话号码', trigger: 'blur' },
          {
            pattern: /^1[3456789]\d{9}$/,
            message: "非法手机号码",
            trigger: ["blur", "change"],
          },
        ],
        email: [
          // { required: true, message: '请输入邮箱地址', trigger: 'blur' },
          {
            type: "email",
            message: "非法邮箱地址",
            trigger: ["blur", "change"],
          },
        ],
        organizationId: [
          {
            required: true,
            type: "array",
            message: "请选择部门",
            trigger: "change",
          },
        ],
        roleId: [
          { required: true, message: "请输入权限(0或1)", trigger: "blur" },
        ],
      },
      options: [],
      status: "",
      isUpdate: false,
    };
  },
  mounted() {
    this.getData();
    this.getTreeData();
  },
  methods: {
    // 每页条数改变时触发 选择一页显示多少行
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.currentPage = 1;
      this.pageSize = val;
    },
    filterTag(value) {
      this.status = "";
      this.status = value;
      return true;
    },
    // 当前页改变时触发 跳转其他页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.currentPage = val;
    },
    async getData() {
      let data = {
        pageNo: 0,
        pageSize: 10,
        name: this.keyword,
        status: this.status,
      };
      let res = await get(urlInfo.url.list_new_personnel, data);
      this.personnerlTable = res.data.row;
      this.total = res.data.total;
    },
    searchData() {
      this.filteredpersonnerlTable = this.personnerlTable.filter((item) => {
        return item.username === this.keyword;
      });
      this.personnerlTable = this.filteredpersonnerlTable;
    },
    resetData() {
      this.personnerlTable = this.personData;
      this.keyword = "";
      this.status = "";
      this.getData();
    },
    // 提交新增人员表单
    submitForm() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          let departmentId = this.form.organizationId;
          this.form.organizationId = departmentId[departmentId.length - 1];
          if (!this.isUpdate) {
            post("/user/add_new_personnel", this.form).then((response) => {
              this.$message({
                message: response.message,
                type: "success",
              });
              this.dialogFormVisible = false;
              this.getData();
            });
          } else {
            put("/user/update_new_personnel", this.form).then((res) => {
              this.$message({
                message: res.message,
                type: "success",
              });
              this.dialogFormVisible = false;
              this.getData();
            });
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 清空Cascader空白
    clearCascaderBlank(list) {
      list.forEach((i) => {
        if (i.children.length === 0) {
          i.children = undefined;
        } else {
          this.clearCascaderBlank(i.children);
        }
      });
    },
    fnFilterChangeInit() {
      this.personData = [];
      this.getData();
    },
    /*
     * @param  list 数据列表
     * @param  id 后端返回的id
     **/
    getParentsById(list, id) {
      for (let i in list) {
        if (list[i].id == id) {
          return [list[i].id];
        }
        if (list[i].children) {
          let node = this.getParentsById(list[i].children, id);
          if (node !== undefined) {
            //查询到把父节把父节点加到数组前面
            node.unshift(list[i].id);
            return node;
          }
        }
      }
    },
    import {
        get,
        post,
        put
    } from "@/api/util/requestUtil";
    import urlInfo from "../../../api/urlEnum/personnel.js";
    import {
        getOrganizationalApi
    } from "@/api/laboratory/organizational";
    export default {
        data() {
            return {
                keyword: "",
                roleList: "",
                personnerlTable: [],
                filteredpersonnerlTable: [],
                currentindex: 1,
                currentPage: 1, // 当前页码
                total: 0, // 总条数
                pageSize: 100, // 每页的数据条数
                personData: [], // 用来存放接口传过来的人员列表数据
                dialogFormVisible: false,
                form: {
                    account: "",
                    age: "",
                    email: "",
                    name: "",
                    phone: "",
                    organizationId: "",
                    roleId: "",
                },
                myProp: {
                    value: "id",
                    label: "department",
                    checkStrictly: true, //允许选择任意一节
                },
                formLabelWidth: "100px",
                rules: {
                    account: [{
                        required: true,
                        message: "请输入账号",
                        trigger: "blur",
                    }, ],
                    name: [{
                        required: true,
                        message: "请输入名字",
                        trigger: "blur",
                    }, ],
                    phone: [
                        // { required: true, message: '请输入11位电话号码', trigger: 'blur' },
                        {
                            pattern: /^1[3456789]\d{9}$/,
                            message: "非法手机号码",
                            trigger: ["blur", "change"],
                        },
                    ],
                    email: [
                        // { required: true, message: '请输入邮箱地址', trigger: 'blur' },
                        {
                            type: "email",
                            message: "非法邮箱地址",
                            trigger: ["blur", "change"],
                        },
                    ],
                    organizationId: [{
                        required: true,
                        type: "array",
                        message: "请选择部门",
                        trigger: "change",
                    }, ],
                    roleId: [{
                        required: true,
                        message: "请输入权限(0或1)",
                        trigger: "blur"
                    }, ],
                },
                options: [],
                status: "",
                isUpdate: false,
            };
        },
        mounted() {
            this.getData();
            this.getTreeData();
        },
        methods: {
            // 每页条数改变时触发 选择一页显示多少行
            handleSizeChange(val) {
                this.currentPage = 1;
                this.pageSize = val;
            },
            filterTag(value) {
                this.status = "";
                this.status = value;
                return true;
            },
            // 当前页改变时触发 跳转其他页
            handleCurrentChange(val) {
                this.currentPage = val;
            },
            async getData() {
                let data = {
                    pageNo: 0,
                    pageSize: 10,
                    name: this.keyword,
                    status: this.status,
                };
                let res = await get(urlInfo.url.list_new_personnel, data);
                this.personnerlTable = res.data.row;
                this.total = res.data.total;
            },
            searchData() {
                this.filteredpersonnerlTable = this.personnerlTable.filter((item) => {
                    return item.username === this.keyword;
                });
                this.personnerlTable = this.filteredpersonnerlTable;
            },
            resetData() {
                this.personnerlTable = this.personData;
                this.keyword = "";
                this.status = "";
                this.getData();
            },
            // 提交新增人员表单
            submitForm() {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        let departmentId = this.form.organizationId;
                        this.form.organizationId = departmentId[departmentId.length - 1];
                        if (!this.isUpdate) {
                            post("/user/add_new_personnel", this.form).then((response) => {
                                this.$message({
                                    message: response.message,
                                    type: "success",
                                });
                                this.dialogFormVisible = false;
                                this.getData();
                            });
                        } else {
                            put("/user/update_new_personnel", this.form).then((res) => {
                                this.$message({
                                    message: res.message,
                                    type: "success",
                                });
                                this.dialogFormVisible = false;
                                this.getData();
                            });
                        }
                    } else {
                        return false;
                    }
                });
            },
            // 清空Cascader空白
            clearCascaderBlank(list) {
                list.forEach((i) => {
                    if (i.children.length === 0) {
                        i.children = undefined;
                    } else {
                        this.clearCascaderBlank(i.children);
                    }
                });
            },
            fnFilterChangeInit() {
                this.personData = [];
                this.getData();
            },
            /*
             * @param  list 数据列表
             * @param  id 后端返回的id
             **/
            getParentsById(list, id) {
                for (let i in list) {
                    if (list[i].id == id) {
                        return [list[i].id];
                    }
                    if (list[i].children) {
                        let node = this.getParentsById(list[i].children, id);
                        if (node !== undefined) {
                            //查询到把父节把父节点加到数组前面
                            node.unshift(list[i].id);
                            return node;
                        }
                    }
                }
            },

    handleClick(row) {
      this.isUpdate = true;
      this.dialogFormVisible = true;
      this.form.name = row.username;
      this.form.roleName = row.roleName;
      this.form.phone = row.phone;
      this.form.id = row.id;
      this.form.email = row.email;
      this.form.organizationId = this.getParentsById(
        this.options,
        row.departmentId
      );
      this.form.roleId = row.roleName;
      this.form.age = row.age;
      this.form.account = row.account;
    },
    getTreeData() {
      getOrganizationalApi().then((res) => {
        this.options = res.data[0].children;
        this.clearCascaderBlank(this.options);
      });
    },
    getRoleList() {
      get("/user/list").then((res) => {
        console.log(`output->res`, res);
        this.roleList = res.data;
      });
    },
  },
  watch: {
    dialogFormVisible: {
      handler(newVal, oldVal) {
        if (newVal == false) {
          this.isUpdate = false;
          this.form = {};
          this.$refs.form.resetFields();
        } else {
          this.getRoleList();
        }
      },
    },
  },
};
            handleClick(row) {
                this.isUpdate = true;
                this.dialogFormVisible = true;
                this.form.name = row.username;
                this.form.roleName = row.roleName;
                this.form.phone = row.phone;
                this.form.id = row.id;
                this.form.email = row.email;
                this.form.organizationId = this.getParentsById(
                    this.options,
                    row.departmentId
                );
                this.form.roleId = row.roleName;
                this.form.age = row.age;
                this.form.account = row.account;
            },
            getTreeData() {
                getOrganizationalApi().then((res) => {
                    this.options = res.data[0].children;
                    this.clearCascaderBlank(this.options);
                });
            },
            getRoleList() {
                get("/user/list").then((res) => {
                    this.roleList = res.data;
                });
            },
        },
        watch: {
            dialogFormVisible: {
                handler(newVal, oldVal) {
                    if (newVal == false) {
                        this.isUpdate = false;
                        this.form = {};
                        this.$refs.form.resetFields();
                    } else {
                        this.getRoleList();
                    }
                },
            },
        },
    };
</script>

<style lang="scss" scoped>
.personnel-main {
  // width: 100%;
  // height: 100%;
  .page-header-search {
    background: #fff;
    display: flex;
    justify-content: space-between;
    padding: 0 24px 12px 24px;
    .personnel-main {

    .search-bar {
      .el-form {
        .el-form-item {
          margin-bottom: 0px !important;
        // width: 100%;
        // height: 100%;
        .page-header-search {
            background: #fff;
            display: flex;
            justify-content: space-between;
            padding: 20px 24px 12px 24px;

          .el-input {
            width: 360px;
          }
        }
      }
    }
  }
            .search-bar {
                .el-form {
                    .el-form-item {
                        margin-bottom: 0px !important;

  .personner-table {
    background: #fff;
    padding: 20px 20px 10px 20px;
                        .el-input {
                            width: 360px;
                        }
                    }
                }
            }
        }

    > div:nth-child(2) {
      display: flex;
      justify-content: end;
      margin: 10px 0;
    }
  }
}
</style>
        .personner-table {
            background: #fff;
            padding: 20px 20px 10px 20px;

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