fix:回退原先版本

charles

2024-04-29 c7f3fd5215399b37d0511b3bd555150ff1b13507

 src/views/newDashboard/index.vue

@@ -1,36 +1,43 @@
<script setup lang="ts">
import { ref, onMounted, watch } from 'vue'
import { ref, onMounted, watch, nextTick } from 'vue'
import { ElMessage } from 'element-plus'
import TaskTabs from '@/views/dashboard/components/TaskTabs.vue'
import CurrentDateTime from '@/views/dashboard/components/CurrentDateTime.vue'
import { getQualityProcedureApi, getProjectApi, getProductApi, getWorkerApi, updateQualityProcedureApi } from '@/api'
import {
  getQualityProcedureApi,
  getProjectApi,
  getProductApi,
  getWorkerApi,
  updateQualityProcedureApi,
  qualityCountApi,
  IQualityCountParams
} from '@/api'
import BigButton from '@/views/dashboard/components/BigButton.vue'
import EditInspection from '@/views/newDashboard/components/EditInspection.vue'
defineOptions({
  name: 'NewDashboardView'
})
const taskTabsList = [
const taskTabsList: Array<any> = [
  { label: '待质检', value: 1 },
  { label: '已质检', value: 3 }
]
const activeTaskTab = ref(1)
const projectList = ref([])
const productList = ref([])
const projectIdArray = ref([])
const productIdArray = ref([])
const projectIdArray = ref('')
const productIdArray = ref('')
const workerList = ref([])
const pageData = ref({ page: 1, pageSize: 1000 })
const modalObj = ref({ modalValue: false })
const qualityList = ref([])
const lookQuality = ref({})
const oldLookQuality = ref({})
const DEFAULT_QUALITY_COUNT = { wait: '--', over: '--', scrapped: '--', pass: '--' }
const qualityCountObj = ref({ ...DEFAULT_QUALITY_COUNT })
const tableHeaderColor = ({ rowIndex }: any) => {
  if (rowIndex === 0) {
    return 'header-row-class' // 这个类名需要你自己定义
  }
}
const changeTab = (tabObj: any) => {
  console.log(tabObj)
}
const checkProduct = (quality: any) => {
  lookQuality.value = { ...quality }
@@ -42,6 +49,7 @@
    if (code == 200) {
      ElMessage.success(data)
      queryQualityProcedure()
      queryQualityCount()
      modalObj.value.modalValue = false
    } else {
      ElMessage.error(data)
@@ -53,30 +61,45 @@
  getProjectApi(pageData.value).then(({ code, data }: any) => {
    if (code == 200) {
      projectList.value = data
      if (Array.isArray(data) && data.length > 0) {
        projectIdArray.value = data[0].id
        queryProduct()
      }
    }
  })
}
//2.根据项目编号查询产品列表
const queryProduct = () => {
  if (projectIdArray.value && projectIdArray.value.length > 0) {
    getProductApi({ projectId: projectIdArray.value[0], ...pageData.value }).then(({ code, data }) => {
  if (projectIdArray.value) {
    getProductApi({ projectId: projectIdArray.value, ...pageData.value }).then(({ code, data }) => {
      if (code == 200) {
        productList.value = data
        if (Array.isArray(data) && data.length > 0) {
          productIdArray.value = data[0].id
          queryQualityProcedure()
          queryQualityCount()
        }
      }
    })
  } else {
    productList.value = []
    productIdArray.value = []
    productIdArray.value = ''
  }
}
//3.查询工序质检列表
const queryQualityProcedure = () => {
  const params = { status: activeTaskTab.value, projectId: '', productId: '', ...pageData.value, keyword: '' }
  if (Array.isArray(projectIdArray.value) && projectIdArray.value.length > 0) {
    params.projectId = projectIdArray.value[0] + ''
  const params: any = { status: activeTaskTab.value, projectId: '', productId: '', ...pageData.value, keyword: '' }
  if (projectIdArray.value) {
    params.projectId = projectIdArray.value + ''
  } else {
    qualityList.value = []
    return
  }
  if (Array.isArray(productIdArray.value) && productIdArray.value.length > 0) {
    params.productId = productIdArray.value[0] + ''
  if (productIdArray.value) {
    params.productId = productIdArray.value + ''
  } else {
    qualityList.value = []
    return
  }
  getQualityProcedureApi(params).then(({ code, data }: any) => {
    if (code == 200) {
@@ -89,6 +112,7 @@
  [() => activeTaskTab.value, () => productIdArray.value, () => projectIdArray.value],
  () => {
    queryQualityProcedure()
    queryQualityCount()
  },
  { immediate: false }
)
@@ -100,10 +124,35 @@
    }
  })
}
//6.查询质检数据统计
const queryQualityCount = () => {
  const params: IQualityCountParams = { productId: '', projectId: '' }
  if (projectIdArray.value) {
    params.projectId = projectIdArray.value + ''
  } else {
    qualityCountObj.value = { ...DEFAULT_QUALITY_COUNT }
    return
  }
  if (productIdArray.value) {
    params.productId = productIdArray.value + ''
  } else {
    qualityCountObj.value = { ...DEFAULT_QUALITY_COUNT }
    return
  }
  qualityCountApi(params).then(({ code, data }) => {
    if (code == 200) {
      for (let fieldName in data) {
        if (isNaN(parseInt(data[fieldName]))) {
          data[fieldName] = '--'
        }
      }
      qualityCountObj.value = data
    }
  })
}
//6.初始化页面数据
const initPage = () => {
  queryProject()
  queryQualityProcedure()
  queryWorker()
}
onMounted(() => {
@@ -129,97 +178,94 @@
        <div class="img bg1"><img src="@/assets/images/u820.png" /></div>
        <div class="text">
          <div>待检测</div>
          <div>1</div>
          <div>{{ qualityCountObj.wait }}</div>
        </div>
      </div>
      <div class="item">
        <div class="img bg2"><img src="@/assets/images/u820.png" /></div>
        <div class="text">
          <div>完成数</div>
          <div>1</div>
          <div>{{ qualityCountObj.over }}</div>
        </div>
      </div>
      <div class="item">
        <div class="img bg3"><img src="@/assets/images/u820.png" /></div>
        <div class="text">
          <div>合格数</div>
          <div class="success-number">1</div>
          <div>合格率</div>
          <div class="success-number">
            {{ qualityCountObj.pass }}
            <span v-show="!isNaN(parseInt(qualityCountObj.pass))">%</span>
          </div>
        </div>
      </div>
      <div class="item">
        <div class="img bg4"><img src="@/assets/images/u820.png" /></div>
        <div class="text">
          <div>报废数</div>
          <div class="fail-number">0</div>
          <div>报废率</div>
          <div class="fail-number">
            {{ qualityCountObj.scrapped }}<span v-show="!isNaN(parseInt(qualityCountObj.scrapped))">%</span>
          </div>
        </div>
      </div>
    </div>
    <div class="table-filter">
      <div class="left">
        <TaskTabs v-model="activeTaskTab" style="margin-top: 20px" :list="taskTabsList" @change="changeTab"></TaskTabs>
        <TaskTabs v-model="activeTaskTab" style="margin-top: 20px" :list="taskTabsList"></TaskTabs>
      </div>
      <div class="right">
        <el-select
          v-model="projectIdArray"
          :teleported="false"
          size="large"
          :multiple-limit="1"
          multiple
          placeholder="项目"
          :clearable="true"
          @change="queryProduct"
        >
          <el-option v-for="item in projectList" :key="item.id" :label="item.projectName" :value="item.id" multiple>
          <el-option v-for="item in projectList" :key="item.id" :label="item.projectName" :value="item.id">
            <div class="item-option">
              <div>{{ item.id }}</div>
              <div>{{ item.projectName }}</div>
            </div>
          </el-option>
        </el-select>
        <el-select
          v-model="productIdArray"
          :teleported="false"
          size="large"
          :multiple-limit="1"
          multiple
          placeholder="产品"
        >
          <el-option v-for="item in productList" :key="item.id" :label="item.productName" :value="item.id" multiple>
        <el-select v-model="productIdArray" :teleported="false" size="large" placeholder="产品" :clearable="true">
          <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
            <div class="item-option">
              <div>{{ item.id }}</div>
              <div>{{ item.productName }}</div>
              <div>{{ item.name }}</div>
            </div>
          </el-option>
        </el-select>
      </div>
    </div>
    <div class="table">
      <el-empty v-if="qualityList.length == 0" description="暂无数据" />
      <!--<el-empty v-if="qualityList.length == 0" description="暂无数据" />-->
      <el-table
        v-else
        :data="qualityList"
        :header-cell-class-name="tableHeaderColor"
        row-class-name="row-bg"
        style="width: 100%; background: transparent"
        border
      >
        <el-table-column prop="workOrderId" align="center" label="工单号" />
        <el-table-column prop="projectId" align="center" label="项目号" />
        <el-table-column prop="productId" align="center" label="产品号" />
        <el-table-column prop="productName" align="center" label="产品名" />
        <el-table-column prop="procedureId" align="center" label="工序号" />
        <el-table-column prop="procedureName" align="center" label="工序名称" />
        <el-table-column prop="drawingNumber" align="center" label="图号" />
        <el-table-column prop="amount" align="center" label="图号" />
        <el-table-column prop="transferAmount" align="center" label="转移数量" />
        <el-table-column prop="scrappedAmount" align="center" label="报废数量" />
        <el-table-column prop="passAmount" align="center" label="合格数量" />
        <el-table-column prop="workerName" align="center" label="加工员" />
        <el-table-column fixed prop="procedureName" style="background: gray" align="center" label="产品工序" />
        <el-table-column prop="workOrderId" align="center" label="工单编号" />
        <el-table-column prop="productName" align="center" label="产品名称" />
        <el-table-column prop="drawingNumber" align="center" label="产品图号" />
        <el-table-column prop="amount" align="center" label="计划数" />
        <el-table-column prop="transferAmount" align="center" label="转入数" />
        <el-table-column prop="scrappedAmount" align="center" label="报废数" />
        <el-table-column prop="passAmount" align="center" label="合格数" />
        <el-table-column prop="workerName" align="center" label="加工人员" />
        <el-table-column prop="inspectionPeople" align="center" label="质检员" />
        <el-table-column align="center" label="操作" width="120px">
        <!--<el-table-column prop="procedureId" align="center" label="工序号" />-->
        <el-table-column fixed="right" align="center" label="操作" width="120px">
          <template #default="scope">
            <BigButton bg-color="#00ff00" @click="checkProduct(scope.row)">质检</BigButton>
          </template>
        </el-table-column>
        <template #empty>
          <el-empty description="暂无数据"></el-empty>
        </template>
      </el-table>
    </div>
  </div>
@@ -330,22 +376,26 @@
      margin-left: 10px;
    }
    .right {
      width: 34%;
      width: 40%;
      display: flex;
      justify-content: space-around;
      margin-top: 2.5vh;
      margin-right: -10px;
      .el-select {
        width: 256px;
        :deep(.el-select__wrapper) {
          background-color: transparent !important;
          // background-color: transparent !important;
        }
        :deep(.el-select__placeholder) {
          //color: white;
        }
      }
      .el-select-dropdown__item {
        color: white;
        //color: white;
      }
      .el-select-dropdown__item.is-hovering {
        color: #fff;
        background: transparent !important;
        //color: #fff;
        //background: transparent !important;
        /*background: linear-gradient(*/
        /*to right,*/
        /*rgba(147, 250, 255, 0),*/
@@ -354,15 +404,19 @@
        /*);*/
      }
      :deep(.el-select__popper) {
        border: 1px solid #1ca898;
        background: deepskyblue;
        width: 100%;
        //border: 1px solid #1ca898;
        // background: deepskyblue;
      }
      .item-option {
        width: 100%;
        display: flex;
        flex: 1;
        > div {
          width: 50%;
          min-width: 50%;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          text-align: center;
        }
      }
@@ -370,9 +424,6 @@
        background: transparent;
        font-size: 16px;
        color: white;
      }
      :deep(.el-icon) {
        display: none;
      }
    }
  }