zouyu
2023-09-01 234e8f7af3e93f78e5384b64e26c2f23c659bfcc
src/views/experiment/inspectionApplication/Viewdetails/index.vue
@@ -1,280 +1,193 @@
<template>
<div>
    <div style="overflow: hidden;">
        <el-card style="margin: 10px;" v-model="searchData" >
        <div slot="header" class="clearfix">
            <span>
                <i slot="prefix" class="el-icon-s-home" />
                实验管理/原材料检验单</span>
        </div>
        <div class="card-content">
            <el-row :gutter="80">
                <el-form ref="form" :model="searchData" label-width="80px">
                    <el-col :span="6">
                        <el-form-item label="来料日期:" >
                            <el-input :disabled="true" v-model="searchData.from_time"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="供应商名称:" >
                            <el-input :disabled="true" v-model="searchData.supplier"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="产品编号:">
                            <el-input :disabled="true" v-model="searchData.mcode"></el-input>
                        </el-form-item>
                    </el-col>
                </el-form>
            </el-row>
            <el-row :gutter="80">
                <el-form ref="form" :model="searchData" label-width="80px">
                    <el-col :span="6">
                        <el-form-item label="原材料名称:">
                            <el-input :disabled="true" v-model="searchData.name"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="规格型号:">
                            <el-input :disabled="true" v-model="searchData.specifications"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="单位:">
                            <el-input :disabled="true" v-model="searchData.unit"></el-input>
                        </el-form-item>
                    </el-col>
                </el-form>
            </el-row>
            <el-row :gutter="80">
                <el-form ref="form" :model="searchData" label-width="80px">
                    <el-col :span="6">
                        <el-form-item label="数量:">
                            <el-input :disabled="true" v-model="searchData.num"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="登记日期:">
                            <el-input :disabled="true" v-model="searchData.end_time"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="登记人:">
                            <el-input :disabled="true" v-model="searchData.userName"></el-input>
                        </el-form-item>
                    </el-col>
                </el-form>
            </el-row>
        </div>
        </el-card>
                <el-row style="margin: 5px;">
                    <el-col :span="12" style="line-height: 32px;">检验项目</el-col>
                    <el-col :span="12" style="text-align: right;">
                        <!-- <el-button ic size="medium " @click="()=>{}">保存</el-button> -->
                        <el-button icon="el-icon-refresh-lef" size="medium " style="background-color: cornflowerblue;" @click="goback">返回</el-button>
                    </el-col>
                </el-row>
        <div>
            <el-card style="margin: 10px;">
                <el-table
                    :data="tableData"
                    border
                    style="width: 100%">
                    <el-table-column
                    label="序号"
                    type="index"
                    width="50">
                    </el-table-column>
                    <el-table-column
                        prop="date"
                        label="项目"
                        width="180">
                    </el-table-column>
                    <el-table-column
                        prop="name"
                        label="单位"
                        width="180">
                    </el-table-column>
                    <el-table-column
                        prop="kk"
                        label="标准值">
                    </el-table-column>
                    <el-table-column
                        prop="zz"
                        label="内控值">
                    </el-table-column>
                    <el-table-column
                        prop="oo"
                        wight="200"
                        label="经验人">
                        <template>
                            <el-select v-model="value" placeholder="黄晓明">
                                <el-option
                                    v-for="item in cities"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                    <span style="float: left">{{ item.label }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                                    </el-option>
                            </el-select>
                        </template>
                    </el-table-column>
                    <el-table-column
                        prop="pp"
                        label="实验设备">
                        <template>
                            <el-select v-model="value" placeholder="拉力机">
                                <el-option
                                v-for="item in cities"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </template>
                    </el-table-column>
                </el-table>
            </el-card>
        </div>
    </div>
</div>
   <div>
      <div style="overflow: hidden;">
         <el-card style="margin: 10px;">
            <div slot="header" class="clearfix">
               <span>
                  <i slot="prefix" class="el-icon-s-home" />
                  实验管理/原材料检验单</span>
            </div>
            <div class="card-content">
               <el-row>
                  <el-form ref="form" :model="searchData" label-width="150px">
                     <el-col :span="8">
                        <el-form-item label="来料日期:">
                           <el-input :disabled="true" v-model="searchData.formTime"></el-input>
                        </el-form-item>
                     </el-col>
                     <el-col :span="8">
                        <el-form-item label="供应商名称:">
                           <el-input :disabled="true" v-model="searchData.supplier"></el-input>
                        </el-form-item>
                     </el-col>
                     <el-col :span="8">
                        <el-form-item label="产品编号:">
                           <el-input :disabled="true" v-model="searchData.code"></el-input>
                        </el-form-item>
                     </el-col>
                  </el-form>
               </el-row>
               <el-row>
                  <el-form ref="form" :model="searchData" label-width="150px">
                     <el-col :span="8">
                        <el-form-item label="原材料名称:">
                           <el-input :disabled="true" v-model="searchData.name"></el-input>
                        </el-form-item>
                     </el-col>
                     <el-col :span="8">
                        <el-form-item label="规格型号:">
                           <el-input :disabled="true" v-model="searchData.specifications"></el-input>
                        </el-form-item>
                     </el-col>
                     <el-col :span="8">
                        <el-form-item label="单位:">
                           <el-input :disabled="true" v-model="searchData.unit"></el-input>
                        </el-form-item>
                     </el-col>
                  </el-form>
               </el-row>
               <el-row>
                  <el-form ref="form" :model="searchData" label-width="150px">
                     <el-col :span="8">
                        <el-form-item label="数量:">
                           <el-input :disabled="true" v-model="searchData.num"></el-input>
                        </el-form-item>
                     </el-col>
                     <el-col :span="8">
                        <el-form-item label="登记日期:">
                           <el-input :disabled="true" v-model="searchData.endTime"></el-input>
                        </el-form-item>
                     </el-col>
                     <el-col :span="8">
                        <el-form-item label="登记人:">
                           <el-input :disabled="true" v-model="searchData.userName"></el-input>
                        </el-form-item>
                     </el-col>
                  </el-form>
               </el-row>
            </div>
         </el-card>
         <el-row style="margin: 0 20px;">
            <el-col :span="12" style="line-height: 32px;">检验项目</el-col>
            <el-col :span="12" style="text-align: right;">
               <el-button icon="el-icon-refresh-lef" size="medium" @click="goback">返回</el-button>
            </el-col>
         </el-row>
         <div>
            <el-card style="margin: 10px;">
               <el-table :data="insProducts" height="calc(80vh - 250px)" border style="width: 100%">
                  <el-table-column label="序号" type="index" width="50">
                  </el-table-column>
                  <el-table-column prop="name" label="项目" width="200">
                  </el-table-column>
                  <el-table-column prop="unit" label="单位" width="150">
                  </el-table-column>
                  <el-table-column prop="internal" label="标准值">
                  </el-table-column>
                  <el-table-column prop="required" label="内控值">
                  </el-table-column>
                  <el-table-column prop="userId" label="责任人" width="220px">
                     <template slot-scope="scope">
                        <el-select v-model="scope.row.userId" slot="append"
                           @change="(val)=>chooseUseProId(val, scope.row)">
                           <el-option v-for="(item,indxe) in ZERENren" :key="indxe" :label="item.name"
                              :value="item.id"></el-option>
                        </el-select>
                     </template>
                  </el-table-column>
                  <el-table-column prop="instrumentId" label="实验设备" width="300px">
                     <template slot-scope="scope">
                        <el-cascader v-model="scope.row.instrumentId" :options="devices"
                           :props="{label: 'Name',value: 'Id',children: 'childrenList'}"
                           @change="(val)=>chooseEquipment(val, scope.row)" style="width: 100%;"></el-cascader>
                     </template>
                  </el-table-column>
               </el-table>
            </el-card>
         </div>
      </div>
   </div>
</template>
<script>
  import { selectInspectsList, selectAll, addInspect} from '@/api/experiment/planAssignments'
export default {
    data(){
        return {
            searchData:{
                from_time:'',
                supplier:'',
                mcode:'',
                name:'',
                specifications:'',
                unit:'',
                num:'',
                userName:'',
                end_time:'',
            },
            value:{},
            cities:[{
                value: 'Beijing',
                label: '黄小明'
                }, {
                value: 'Shanghai',
                label: '黄小明'
                }, {
            }],
            tableData:[{
            date: '导线',
            name: 'mm',
            kk:'30.0',
            zz:'30.0',
            oo:'黄晓明',
            pp:'拉力机',
          },{
            date: '导线',
            name: 'mm',
            kk:'30.0',
            zz:'30.0',
            oo:'黄晓明',
            pp:'拉力机',
          },{
            date: '导线',
            name: 'mm',
            kk:'30.0',
            zz:'30.0',
            oo:'黄晓明',
            pp:'拉力机',
          },{
            date: '导线',
            name: 'mm',
            kk:'30.0',
            zz:'30.0',
            oo:'黄晓明',
            pp:'拉力机',
          },{
            date: '导线',
            name: 'mm',
            kk:'30.0',
            zz:'30.0',
            oo:'黄晓明',
            pp:'拉力机',
          }],
          currentPage:1,
          pageSize:8,
          id:''
        }
    },
    created(){
        console.log(this.$route.query.icode);
        this.id = this.$route.query.icode;
        this.selectInspectsList()
    },
    methods: {
      async goback(){
        this.$router.push({name:'inspectionApplication'})
      },
      async selectInspectsList() {
        // 获取分页列表
        const res = await selectInspectsList({ countSize: this.pageSize, pageSize: this.currentPage ,message:this.id})
        // this.inspectionTable = data
        console.log(res)
    //     res.data.forEach((item) => {
    //       var formTime = item["DATE_FORMAT(`form_time`,'%Y-%m-%d')"]
    //       var startTime = item["DATE_FORMAT(i"]["`start_time`,'%Y-%m-%d')"]
    //       var endTime = item["DATE_FORMAT(i"]["`end_time`,'%Y-%m-%d')"]
    //       var checkdate = startTime + '~' + endTime
    //       var createTime = item["DATE_FORMAT(i"]["`create_time`,'%Y-%m-%d')"]
    //       item['formTime'] = formTime // 来料日期
    //       item['checkdate'] = checkdate // 检验日期
    //       item['createTime'] = createTime // 登记日期
    //   })
        this.searchData.mcode = res.data.row[0].mcode
        this.searchData.supplier = res.data.row[0].supplier
        this.searchData.from_time = res.data.row[0]["DATE_FORMAT(`form_time`,'%Y-%m-%d')"]
        this.searchData.name = res.data.row[0].name
        this.searchData.specifications = res.data.row[0].specifications
        this.searchData.unit = res.data.row[0].unit
        this.searchData.num = res.data.row[0].num
        this.searchData.end_time = res.data.row[0]["DATE_FORMAT(i"]["`end_time`,'%Y-%m-%d')"]
        this.searchData.userName = res.data.row[0].userName
        const data = res.data.row
        data.forEach((item) => {
          var formTime = item["DATE_FORMAT(`form_time`,'%Y-%m-%d')"]
          var startTime = item["DATE_FORMAT(i"]["`start_time`,'%Y-%m-%d')"]
          var endTime = item["DATE_FORMAT(i"]["`end_time`,'%Y-%m-%d')"]
          var checkdate = startTime + '~' + endTime
          var createTime = item["DATE_FORMAT(i"]["`create_time`,'%Y-%m-%d')"]
          item['formTime'] = formTime // 来料日期
          item['checkdate'] = checkdate // 检验日期
          item['createTime'] = createTime // 登记日期
      })
        this.inspectionTable = data
        this.total = res.data.total
      },
}
}
   import {
      selectInspectsListById,
      selectUser,
      selectEquipment,
      chooseUseProId,
      chooseEquipment
   } from '@/api/experiment/planAssignments'
   export default {
      data() {
         return {
            searchData: {
               formTime: '',
               supplier: '',
               code: '',
               name: '',
               specifications: '',
               unit: '',
               num: '',
               endTime: '',
               userName: '',
            },
            insProducts: [],
            value: '',
            SHEbei: [],
            id: null,
            ZERENren: [],
            devices: []
         }
      },
      created() {
         this.id = this.$route.params.id
         this.selectInspectsListById()
         this.selectUser()
         this.selectEquipment()
      },
      methods: {
         //返回
         async goback() {
            this.$router.push({
               name: 'inspectionApplication'
            })
         },
         //检验单责任人
         async selectUser() {
            const res = await selectUser()
            this.ZERENren = res.data
         },
         async selectEquipment() {
            const res = await selectEquipment()
            this.devices = JSON.parse(JSON.stringify(res.data).replaceAll('father', '').replaceAll('ins', '').replaceAll(
               'son', '').replaceAll('name', 'Name'))
         },
         //检验单表
         async selectInspectsListById() {
            const res = await selectInspectsListById({
               id: this.id
            })
            this.searchData = res.data
            this.insProducts = res.data.insProducts
         },
         chooseUseProId(val, row) {
            chooseUseProId({
               id: row.id,
               userProId: val
            }).then(res => {
               if (res.data) this.$message.success('责任人分配成功')
            })
         },
         chooseEquipment(val, row) {
            chooseEquipment({
               id: row.id,
               equipmentId: val[2]
            }).then(res => {
               if (res.data) this.$message.success('设备分配成功')
            })
         }
      }
   }
</script>
<style lang="scss" scoped>
</style>
</style>