|
|
@@ -68,7 +68,12 @@
|
|
|
:content="goods.basicInformation.status"
|
|
|
>
|
|
|
<template #reference>
|
|
|
- <span class="m-2"> 状态: {{goods.basicInformation.status}}</span>
|
|
|
+ <span class="m-2 ">
|
|
|
+ 状态:
|
|
|
+ <span class="bold-font" :style="{color:goods.basicInformation.status?.color}">
|
|
|
+ {{goods.basicInformation.status?.name ?? ''}}
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
</template>
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
@@ -76,12 +81,17 @@
|
|
|
<el-popover
|
|
|
placement="top-start"
|
|
|
:width="200"
|
|
|
- title="密钥状态"
|
|
|
+ title="中化密钥"
|
|
|
trigger="hover"
|
|
|
:content="goods.basicInformation.key_name"
|
|
|
>
|
|
|
<template #reference>
|
|
|
- <span class="m-2"> 密钥状态: {{goods.basicInformation.key_name}}</span>
|
|
|
+ <span class="m-2">
|
|
|
+ 密钥状态:
|
|
|
+ <span class="bold-font" :style="{color:goods.basicInformation.key_name?.color}">
|
|
|
+ {{goods.basicInformation.key_name?.name ?? ''}}
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
</template>
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
@@ -94,7 +104,12 @@
|
|
|
:content="goods.basicInformation.stand_name"
|
|
|
>
|
|
|
<template #reference>
|
|
|
- <span class="m-2"> 团标状态: {{goods.basicInformation.stand_name}}</span>
|
|
|
+ <span class="m-2 ">
|
|
|
+ 团标状态:
|
|
|
+ <span class="bold-font" :style="{color:goods.basicInformation.stand_name?.color}">
|
|
|
+ {{goods.basicInformation.stand_name?.name ?? ''}}
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
</template>
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
@@ -176,7 +191,25 @@
|
|
|
<el-col :xs="24" >
|
|
|
<el-card style="height: 40vh" class="my-fill mt8" shadow="hover" header="生产日志">
|
|
|
<el-table v-loading="goods.loadingProduct" :data="goods.productionLog.tableData" row-key="id" style="width: 100%">
|
|
|
- <el-table-column v-for="column in goods.productionLog.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label" />
|
|
|
+ <el-table-column prop="alarmDate" label="生产时间" />
|
|
|
+ <el-table-column prop="eventName" label="操作员" />
|
|
|
+ <el-table-column prop="step" label="工序" >
|
|
|
+ <template #default="{ row }">
|
|
|
+ {{row.step}}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="state" label="状态" >
|
|
|
+ <template #default="{ row }">
|
|
|
+ {{row.state ? "正常" : "异常"}}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="img" label="生产图片" >
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-link :underline="false" @click="showBigPic(row.img)">查看大图</el-link>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="remarks" label="备注" />
|
|
|
+<!-- <el-table-column v-for="column in goods.productionLog.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label" />-->
|
|
|
</el-table>
|
|
|
<div class="my-flex my-flex-end" style="margin-top: 20px">
|
|
|
<el-pagination
|
|
|
@@ -234,17 +267,20 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts" name="goodInfo">
|
|
|
-import {onMounted, reactive} from "vue";
|
|
|
-import {ComponentDetails} from "/src/api/admin/productionManagement/ComponentDetails";
|
|
|
-import router from "/src/router";
|
|
|
+import {onMounted, reactive, ref} from "vue";
|
|
|
+import {ComponentDetails} from "/@/api/admin/productionManagement/ComponentDetails";
|
|
|
+import router from "/@/router";
|
|
|
import type {
|
|
|
alarmLog,
|
|
|
goodsInformationBasic,
|
|
|
productionLog
|
|
|
-} from "/src/api/admin/productionManagement/ComponentDetailsDto";
|
|
|
-import {adminProductGoodsInfoDto, filterData} from "/src/api/admin/productionManagement/ComponentDetailsDto";
|
|
|
-import type {columnsProps, pageInput} from "/src/api/admin/shareDto/shareDto";
|
|
|
+} from "/@/api/admin/productionManagement/ComponentDetailsDto";
|
|
|
+import {adminProductGoodsInfoDto, filterData} from "/@/api/admin/productionManagement/ComponentDetailsDto";
|
|
|
+import type {columnsProps, pageInput} from "/@/api/admin/shareDto/shareDto";
|
|
|
import { Picture as IconPicture } from '@element-plus/icons-vue'
|
|
|
+import {sessionStorageSet} from "/@/utils/sessionStorageSet";
|
|
|
+import {DictApi} from "/@/api/admin/Dict";
|
|
|
+import {ProductionLogRequestBody} from "/@/api/admin/productionManagement/ComopnentDto";
|
|
|
//组件的页面对象
|
|
|
const goods = reactive({
|
|
|
/**部件id */
|
|
|
@@ -267,7 +303,14 @@ const goods = reactive({
|
|
|
/**表格数据 */
|
|
|
tableData: [] as Array<productionLog>,
|
|
|
/**动态表头 */
|
|
|
- dynamicColumns: [] as Array<columnsProps>,
|
|
|
+ // dynamicColumns: [
|
|
|
+ // { prop: 'alarmDate', label: '生产时间' },
|
|
|
+ // { prop: 'eventName', label: '操作员 ' },
|
|
|
+ // { prop: 'step', label: '工序' },
|
|
|
+ // { prop: 'state', label: '状态' },
|
|
|
+ // { prop: 'img', label: '生产图片' },
|
|
|
+ // { prop: 'remarks', label: '备注' },
|
|
|
+ // ] ,
|
|
|
/**页面分页 */
|
|
|
pageInput: {
|
|
|
CurrentPage: 1,
|
|
|
@@ -327,23 +370,34 @@ const onAlarmLogCurrentChange = (val) => {
|
|
|
initAlarmLog()
|
|
|
}
|
|
|
|
|
|
+
|
|
|
/**
|
|
|
* 初始化数据
|
|
|
*/
|
|
|
const initBasicInformation = async () => {
|
|
|
goods.loadingBasic = true
|
|
|
- const res = await new ComponentDetails().getBasicInfo({GUID:goods.id} ).catch(() => {
|
|
|
+ const { data } = await new ComponentDetails().getBasicInfo({GUID:goods.id} ).catch(() => {
|
|
|
goods.loadingBasic = false
|
|
|
})
|
|
|
- goods.basicInformation = res?.data
|
|
|
+ goods.basicInformation = ({
|
|
|
+ ...data,
|
|
|
+ status: componentStatusType.value?.get(data.status) ?? '',
|
|
|
+ key_name:basicInformationStatus.value?.get(data.key_name) ?? '',
|
|
|
+ stand_name:basicInformationStatus.value?.get(data.stand_name) ?? ''
|
|
|
+ })
|
|
|
goods.loadingBasic = false
|
|
|
}
|
|
|
|
|
|
const initProductionLog = async () => {
|
|
|
goods.loadingProduct = true
|
|
|
- goods.productionLog = await new ComponentDetails().getProductionLog(goods.productionLog.pageInput, goods.id)
|
|
|
+ const { data } = await new ComponentDetails().getProductionLog({...goods.productionLog.pageInput,filter:({id:goods.id})} as ProductionLogRequestBody)
|
|
|
+ goods.productionLog.tableData = data?.list?.reduce((arr, item) => {
|
|
|
+ item.step = productionLogStatus.value?.get(item.step).name
|
|
|
+ arr.push(item)
|
|
|
+ return arr
|
|
|
+ },[]) ?? []
|
|
|
+ goods.productionLog.total = data?.total ?? 0
|
|
|
goods.loadingProduct = false
|
|
|
- // console.log(goods.productionLog)
|
|
|
}
|
|
|
|
|
|
const initAlarmLog = async () => {
|
|
|
@@ -351,13 +405,98 @@ const initAlarmLog = async () => {
|
|
|
goods.alarmLog = await new ComponentDetails().getAlarmLog(goods.productionLog.pageInput, goods.id)
|
|
|
goods.loadingAlarm = false
|
|
|
// console.log(goods.alarmLog)
|
|
|
+}
|
|
|
+
|
|
|
+//设置获取部件中化密钥，团标状态
|
|
|
+const basicInformationStatusCode = reactive({
|
|
|
+ code:'componentStatus'
|
|
|
+})
|
|
|
+//部件中化密钥，团标状态对象
|
|
|
+const basicInformationStatus = ref()
|
|
|
+
|
|
|
+//设置获取部件状态的编码
|
|
|
+const componentStatusTypeCode = reactive({
|
|
|
+ code:'componentStatusType'
|
|
|
+})
|
|
|
+//部件状态对象
|
|
|
+const componentStatusType = ref()
|
|
|
+
|
|
|
+//设置获取部件状态的编码
|
|
|
+const productionLogStatusCode = reactive({
|
|
|
+ code:'productionLogListStatus'
|
|
|
+})
|
|
|
+//部件状态对象
|
|
|
+const productionLogStatus = ref()
|
|
|
+
|
|
|
+/**
|
|
|
+ * 初始化，获取缓存 中化密钥 图标密钥
|
|
|
+ */
|
|
|
+const initBasicInformationCache = async () => {
|
|
|
+ let sessionStatus;
|
|
|
+ sessionStatus = sessionStorageSet.getItemWithExpiration(basicInformationStatusCode.code as string)
|
|
|
+ if (!sessionStatus){
|
|
|
+ const res = await new DictApi().getList([basicInformationStatusCode.code] as string[])
|
|
|
+ /**存一天的缓存*/
|
|
|
+ sessionStorageSet.setItemWithExpiration(basicInformationStatusCode.code as string, res?.data,1)
|
|
|
+ sessionStatus = sessionStorageSet.getItemWithExpiration(basicInformationStatusCode.code as string as string)
|
|
|
+ }
|
|
|
|
|
|
+ /**将状态转化为map的形式*/
|
|
|
+ basicInformationStatus.value = sessionStatus.reduce((map, obj) => {
|
|
|
+ obj.color = obj.code.split("_")[1]
|
|
|
+ map.set(Number(obj.value), {...obj});
|
|
|
+ return map;
|
|
|
+ },new Map());
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 初始化，获取缓存部件状态
|
|
|
+ */
|
|
|
+const initComponentStatusType = async () => {
|
|
|
+ let sessionStatus;
|
|
|
+ sessionStatus = sessionStorageSet.getItemWithExpiration(componentStatusTypeCode.code as string)
|
|
|
+ if (!sessionStatus){
|
|
|
+ const res = await new DictApi().getList([componentStatusTypeCode.code] as string[])
|
|
|
+ /**存一天的缓存*/
|
|
|
+ sessionStorageSet.setItemWithExpiration(componentStatusTypeCode.code as string, res?.data,1)
|
|
|
+ sessionStatus = sessionStorageSet.getItemWithExpiration(componentStatusTypeCode.code as string as string)
|
|
|
+ }
|
|
|
+
|
|
|
+ /**将状态转化为map的形式*/
|
|
|
+ componentStatusType.value = sessionStatus.reduce((map, obj) => {
|
|
|
+ obj.color = obj.code.split("_")[1]
|
|
|
+ map.set(Number(obj.value), {...obj});
|
|
|
+ return map;
|
|
|
+ },new Map());
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 初始化，获取生产日志工序缓存
|
|
|
+ */
|
|
|
+const initProductionLogCache = async () => {
|
|
|
+ let sessionStatus;
|
|
|
+ sessionStatus = sessionStorageSet.getItemWithExpiration(productionLogStatusCode.code as string)
|
|
|
+ if (!sessionStatus){
|
|
|
+ const res = await new DictApi().getList([productionLogStatusCode.code] as string[])
|
|
|
+ /**存一天的缓存*/
|
|
|
+ sessionStorageSet.setItemWithExpiration(productionLogStatusCode.code as string, res?.data,1)
|
|
|
+ sessionStatus = sessionStorageSet.getItemWithExpiration(productionLogStatusCode.code as string as string)
|
|
|
+ }
|
|
|
+
|
|
|
+ /**将状态转化为map的形式*/
|
|
|
+ productionLogStatus.value = sessionStatus.reduce((map, obj) => {
|
|
|
+ map.set(Number(obj.value), {...obj});
|
|
|
+ return map;
|
|
|
+ },new Map());
|
|
|
}
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
goods.id = router.currentRoute.value.params.guid
|
|
|
// console.log(goods.productionLog.pageInput.PageSize)
|
|
|
+ initBasicInformationCache()
|
|
|
+ initComponentStatusType()
|
|
|
+ initProductionLogCache()
|
|
|
/**初始化 */
|
|
|
initBasicInformation()
|
|
|
initProductionLog()
|
|
|
@@ -397,6 +536,10 @@ onMounted(() => {
|
|
|
text-overflow: ellipsis;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+
|
|
|
+ .bold-font{
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
}
|
