Web/admin.ui.plus-master/src/views/admin/PCBA/boardTestRecord/index.vue

<template>
  <div class="layout-pd">
    <el-row>
<!--操作-->
      <el-col :xs="24" >
        <el-card class="mt8"  shadow="hover" >
<el-form :model="state.filter" :inline="true" @submit.stop.prevent>
            <el-form-item prop="name" style="width: 100%">
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                <el-form-item label="序列号">
                  <el-input v-model="state.filter.serno" placeholder="单行输入" clearable></el-input>
                </el-form-item>
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                <el-form-item label="外部序列号">
                  <el-input v-model="state.filter.exserno" placeholder="单行输入" clearable></el-input>
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
  <el-form-item label="主板类型">
                  <el-select v-model="state.filter.boardType" placeholder="">
                    <el-option v-for="(value, key) in PCBABoardType" :key="key" :label="value[1].name"
                      :value="Number(value[1].value)" />
                  </el-select>
                </el-form-item>
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                <el-form-item label="功能码">
                    <el-select  v-model="state.filter.functionCode" default-first-option="true" filterable allow-create 
                      value-key="code"
                      @blur="codeblur()"
                      title='可直接输入具体功能码'
                      ref="codeSel">
                    <el-option v-for="item in options" :key="item.key" :label="item.name"
                      :value="Number(item.value)" >

                    </el-option>
                    <!--<el-option  key = "-1" label="所有" value=-1>所有</el-option>-->
                    
                  </el-select>
                </el-form-item>
                
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                <el-form-item label="检测类型">
                  <el-select v-model="state.filter.testType" placeholder="">
                    <el-option v-for="(value, key) in PCBATestType" :key="key" :label="value[1].name"
                      :value="Number(value[1].value)" />
                  </el-select>
                </el-form-item>
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
            <el-form-item label="开始时间">
                  <el-date-picker
                    v-model="state.filter.beginTime"
                    type="datetime"
                    value-format="YYYY-MM-DD HH:mm:ss"
                    range-separator="To"
                    start-placeholder="Start date"
                    end-placeholder="End date"
                  />
                </el-form-item>
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
            <el-form-item label="结束时间">
                  <el-date-picker
                    v-model="state.filter.endTime"
                    type="datetime"
                    value-format="YYYY-MM-DD HH:mm:ss"
                    range-separator="To"
                    start-placeholder="Start date"
                    end-placeholder="End date"
                  />
                </el-form-item>
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
  <el-form-item label="测试结果">
                  <el-select v-model="state.filter.result" placeholder="">
                    <el-option v-for="(value, key) in PCBATestState" :key="key" :label="value[1].name"
                      :value="Number(value[1].value)" />
                  </el-select>
                </el-form-item>
              </el-col>
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
                <el-form-item label="测试员">
                  <el-input v-model="state.filter.user" placeholder="单行输入" clearable></el-input>
                </el-form-item>
              </el-col>
</el-form-item>
          </el-form>
<div class="my-flex my-flex-start" >
<el-button  type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
</div>
</el-card>
      </el-col>
<!--表格-->
      <el-col  :xs="24" >
        <el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
<el-table v-loading="state.loading" stripe :data="state.tableModel" row-key="id" style="width: 100%">
        <!--<el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label"  >
        </el-table-column>-->

 

        <el-table-column prop="serno" label="序列号" />
        <el-table-column prop="exserno" label="外部序列号" />
            <el-table-column prop="boardType" label="主板类型">
              <template #default="{ row }">
                <div :style="{ color: getPCBABoardType(row.boardType).color }" class="bold-font">
                  {{ getPCBABoardType(row.boardType).name }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="functionCode" label="功能码" />
            <el-table-column prop="functionName" label="功能名称" />
            <el-table-column prop="testType" label="检测类型" >
              <template #default="{ row }">
                <div :style="{ color: getPCBATestType(row.testType).color }" class="bold-font">
                  {{ getPCBATestType(row.testType).name }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="time" label="测试时间" />
            <el-table-column prop="result" label="测试结果">
              <template #default="{ row }">
                <div :style="{ color: getPCBATestState(row.result).color }" class="bold-font">
                  {{ getPCBATestState(row.result).name }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="testNum" label="测试功能数" />
            <el-table-column prop="testSuccessNum" label="测试成功功能数" />
            <el-table-column prop="user" label="测试员" />
            <el-table-column prop="info" label="备注" />
</el-table>
<div class="my-flex my-flex-end" style="margin-top: 20px">
            <el-pagination
              v-model:currentPage="state.pageInput.CurrentPage"
              v-model:page-size="state.pageInput.PageSize"
              :total="state.total"
              :page-sizes="[10, 20, 50, 100]"
              small
              background
              @size-change="onSizeChange"
              @current-change="onCurrentChange"
              layout="total, sizes, prev, pager, next, jumper"
            />
          </div>
</el-card>
      </el-col>
</el-row>
    </div>
  </template>
  <script setup lang="ts">
  import {onBeforeMount, onMounted, reactive, watch,ref} from "vue";
  import eventBus from "/@/utils/mitt";
import { BoardTestRecordApi } from '/@/api/admin/PCBA/boardTestRecordApi'
import { BoardTestRecordDto } from '/@/api/admin/PCBA/boardTestRecordDto'
import type { pageInput } from "/@/api/admin/shareDto/shareDto";
import { useGlobalCacheStore } from "/@/stores/globalCacheStore";
import { getCurrentInstance } from 'vue';
const { proxy: ctx } = getCurrentInstance();

/**获取全局缓存*/
const globalCacheStore = useGlobalCacheStore()
/**数据字典缓存*/
const PCBATestState = ref(globalCacheStore.getGlobalStore().get('pcbaTestState'))
const PCBABoardType = ref(globalCacheStore.getGlobalStore().get('pcbaBoardType'))
const PCBATestType = ref(globalCacheStore.getGlobalStore().get('pcbaTestType'))

const getPCBATestState = (val) => {
  val = String(val)
  if(PCBATestState.value?.has(val)){
    return PCBATestState.value.get(val)
  }else {
    return val
  }
}

const getPCBABoardType = (val) => {
  val = String(val)
  if(PCBABoardType.value?.has(val)){
    return PCBABoardType.value.get(val)
  }else {
    return val
  }
}

const getPCBATestType = (val) => {
  val = String(val)
  if(PCBATestType.value?.has(val)){
    return PCBATestType.value.get(val)
  }else {
    return val
  }
}



const  codeblur = ()=>{

  let value = ctx.$refs.codeSel.selectedLabel

  if(value == '所有'  || value == '')
  {
    value = -1

   // ctx.$refs.codeSel.selectedValue = -1 

   // return
  }

  state.filter.functionCode = value
  
}
  
const options= [{
        value: -1,
        name: '所有',
        key:"-1",
        info:"可直接输入具体功能码"
      }
    ]

/**数据对象*/
  const state = reactive({
    /**加载显示 */
    loading: false,
    /**条件查询模块 */
      filter: {
/**serno */
        serno: "",
/**exserno */
exserno: "",        
/**boardType */
        boardType: -1,
/**functionCode */
        functionCode: -1,
/**检测类型 */
        testType: -1,
/**起始检测时间 */
        beginTime: "",
/**结束检测时间 */
        endTime: "",
/**测试结果 */
        result: -1,
/**测试员 */
        user: "",},
  /**表格信息 */
tableModel: [] as BoardTestRecordDto,
    /**动态表头 */
    dynamicColumns: [
{ prop: 'serno', label: '序列号' },
{ prop: 'boardType', label: '主板类型' },
{ prop: 'boardName', label: '主板名称' },
{ prop: 'functionCode', label: '功能码' },
{ prop: 'functionName', label: '功能名称' },
{ prop: 'testType', label: '检测类型' },
{ prop: 'time', label: '检测时间' },
{ prop: 'result', label: '测试结果' },
{ prop: 'testNum', label: '测试功能数' },
{ prop: 'testSuccessNum', label: '测试成功功能数' },
{ prop: 'user', label: '测试员' },
{ prop: 'duration', label: '测试耗时' },
{ prop: 'info', label: '备注' },],
/**分页标识 */
    pageInput:{
      CurrentPage: 1,
      PageSize: 10,
    } as pageInput,
    /**分页总数 */
    total: 0,
})
  onMounted(() => {
    init()
    eventBus.off('refreshView')
    eventBus.on('refreshView', async () => {
      await init()
    })
  })
  onBeforeMount(() => {
    eventBus.off('refreshView')
  })
  
    /**页条数变化*/
const onSizeChange = () => {
  init()
}

/**页数变化*/
const onCurrentChange = () => {
  init()
}


  /**
  * 监听变换
  */
  watch(() => {},() => {})
/**条件查询 */
          const onQuery = () => {
          init()
        }
        /**初始化 */
        const init = async () => {
          state.loading = true
const res:any = await new BoardTestRecordApi().getList({...state.pageInput, Filter:state.filter})
            state.total = res?.data?.total ?? 0
state.tableModel = res?.data?.list ?? []
          state.loading = false
        }
</script>
<style scoped lang="scss">
  </style>