|
|
@@ -0,0 +1,303 @@
|
|
|
+<template>
|
|
|
+ <div class="layout-pd" >
|
|
|
+ <!--部件电子档案-->
|
|
|
+ <el-row>
|
|
|
+ <!--操作-->
|
|
|
+ <el-col :xs="24" >
|
|
|
+ <el-card class="mt8" shadow="never" >
|
|
|
+ <el-form :model="bomModel.filterModel" @submit.stop.prevent>
|
|
|
+ <el-form-item class="form_item" prop="name" style="width:100%">
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
|
|
|
+ <el-form-item label="物料号">
|
|
|
+ <el-input v-model="bomModel.filterModel.bomMateNo" placeholder="请输入物料号" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
|
|
|
+ <el-form-item label="生产编码">
|
|
|
+ <el-input v-model="bomModel.filterModel.bomProNo" placeholder="请输入生产编码" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
|
|
|
+ <el-form-item label="条码">
|
|
|
+ <el-input v-model.trim="bomModel.filterModel.barcode" placeholder="请输入条码" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <hr>
|
|
|
+
|
|
|
+ <!-- 按钮 -->
|
|
|
+ <el-row justify="space-between" class="submit-button">
|
|
|
+ <el-row>
|
|
|
+ <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
|
|
|
+ <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
|
|
|
+ </el-row>
|
|
|
+ <el-button v-auth="'api:admin:file:upload-file'" type="primary" icon="ele-Upload" @click="onUpload"> 上传
|
|
|
+ </el-button>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ <!--表格-->
|
|
|
+
|
|
|
+ <el-col :xs="24">
|
|
|
+ <el-card style="overflow: hidden;" class="my-fill mt8" shadow="never">
|
|
|
+ <el-table v-loading="bomModel.loading" stripe :data="bomModel.bomListData" row-key="id" style="width: 100%">
|
|
|
+ <el-table-column prop="guid" label="序号" align="center" />
|
|
|
+ <el-table-column prop="manufacturer" label="厂商" align="center" />
|
|
|
+ <el-table-column prop="bomName" label="部件名称" />
|
|
|
+ <el-table-column prop="bomNo" label="物料号" />
|
|
|
+ <el-table-column prop="bomProNo" label="生产编号" />
|
|
|
+ <el-table-column prop="barCode" label="条码" align="center"/>
|
|
|
+ <el-table-column prop="software_v" label="软件版本" />
|
|
|
+ <el-table-column prop="keyCount" label="密钥数量" />
|
|
|
+ <el-table-column prop="checkStatus" label="检测状态" />
|
|
|
+ <el-table-column prop="infusionOperator" label="灌注人" />
|
|
|
+ <el-table-column prop="status" label="状态" align="center">
|
|
|
+
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="创建时间" />
|
|
|
+ <el-table-column prop="remark" label="备注">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation"
|
|
|
+ width="100">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-link class="my-el-link mr12 ml12" @click="toPage(row)" type="primary" icon="ele-Tickets"
|
|
|
+ :underline="false" target="_blank">详情</el-link>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="my-flex my-flex-end" style="margin-top: 20px">
|
|
|
+ <el-pagination v-model:currentPage="pageState.pageInput.currentPage"
|
|
|
+ v-model:page-size="pageState.pageInput.pageSize" :total="bomModel.total" :page-sizes="[10, 15, 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 lang="ts" setup name="admin/Component">
|
|
|
+import { onMounted, reactive, ref } from 'vue' //computed, getCurrentInstance
|
|
|
+import { ComponentApi } from '/@/api/admin/productionManagement/Component'
|
|
|
+// import dayjs from 'dayjs'
|
|
|
+// import eventBus from '/@/utils/mitt'
|
|
|
+import { PageInputFileGetPageDto } from "/@/api/admin/productionManagement/ComopnentDto";
|
|
|
+import { ComponentGetPageOutPut } from "/@/api/admin/productionManagement/CommunalDto";
|
|
|
+import router from "/@/router";
|
|
|
+
|
|
|
+import { useGlobalCacheStore } from "/@/stores/globalCacheStore";
|
|
|
+import StatusBox from '/@/components/StatusBox.vue';
|
|
|
+import { useDynamicPageSize } from '/@/composables/useDynamicPageSize';
|
|
|
+
|
|
|
+
|
|
|
+// 使用组合式函数获取分页状态
|
|
|
+const pageState = useDynamicPageSize(10, 15);
|
|
|
+
|
|
|
+/**获取全局缓存*/
|
|
|
+const globalCacheStore = useGlobalCacheStore()
|
|
|
+/**部件类型缓存*/
|
|
|
+const componentType = ref(globalCacheStore.getGlobalStore().get('componentType'))
|
|
|
+/**部件电子档案 - 列表状态 */
|
|
|
+const componentStatusType = ref(globalCacheStore.getGlobalStore().get('componentStatusType'))
|
|
|
+/**部件电子档案 - 列表中化密钥、团标密钥 */
|
|
|
+const componentStatus = ref(globalCacheStore.getGlobalStore().get('componentStatus'))
|
|
|
+
|
|
|
+const fileUploadRef = ref()
|
|
|
+
|
|
|
+//部件的页面对象
|
|
|
+const bomModel = reactive({
|
|
|
+ loading: false,
|
|
|
+ fileFormTitle: '',
|
|
|
+ filterModel: {
|
|
|
+ fileName: '',
|
|
|
+ bomType: '',
|
|
|
+ bomName: '',
|
|
|
+ bomProNo: '',
|
|
|
+ bomMateNo: '',
|
|
|
+ manufacturer: '',
|
|
|
+ barcode: ''
|
|
|
+ },
|
|
|
+ total: 0,
|
|
|
+ pageInput: {
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ } as PageInputFileGetPageDto,
|
|
|
+ //bomListData: [] as Array<ComponentGetPageOutPut>,
|
|
|
+ bomListData: [
|
|
|
+ // 直接把上面的对象放在这里
|
|
|
+ {
|
|
|
+ guid: 730439586459717,
|
|
|
+ bomName: "网络通讯板",
|
|
|
+ bomNo: "TOK-980804-303",
|
|
|
+ bomProNo: "A1000633",
|
|
|
+ cpuId: "A1000633",
|
|
|
+ software_v: "v1.0.5",
|
|
|
+ status: '已生产',
|
|
|
+ key_name: "POWER_MODULE",
|
|
|
+ stand_name: "STANDARD_V1",
|
|
|
+ tqcKeyState: 1,
|
|
|
+ ecvrKeyState: 0,
|
|
|
+ createTime: '2025-10-15 10:26:19',
|
|
|
+ remark: "",
|
|
|
+ manufacturer: "托肯恒山科技(广州)有限公司",
|
|
|
+ keyCount:8,
|
|
|
+ checkStatus:'通过',
|
|
|
+ infusionOperator: "陈伟",
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ bomLogsTitle: '',
|
|
|
+})
|
|
|
+console.log(componentStatusType.value)
|
|
|
+
|
|
|
+
|
|
|
+/**部件电子档案 - 列表状态 */
|
|
|
+const getComponentStatusType = (val) => {
|
|
|
+ val = String(val)
|
|
|
+
|
|
|
+
|
|
|
+ if (componentStatusType.value?.has(val)) {
|
|
|
+ return componentStatusType.value.get(val)
|
|
|
+ } else {
|
|
|
+ return val
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/**部件电子档案 - 列表中化密钥、团标密钥 */
|
|
|
+const getComponentStatus = (val) => {
|
|
|
+ val = String(val)
|
|
|
+ if (componentStatus.value.has(val)) {
|
|
|
+ return componentStatus.value.get(val)
|
|
|
+ } else {
|
|
|
+ return val
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//const { copyText } = commonFunction()
|
|
|
+
|
|
|
+//const previewImglist = computed(() => {
|
|
|
+//let imgList = [] as string[]
|
|
|
+//bomModel.bomListData.forEach((a) => {
|
|
|
+
|
|
|
+//})
|
|
|
+// return imgList
|
|
|
+//})
|
|
|
+
|
|
|
+onMounted(async () => {
|
|
|
+ // 初始化分页大小
|
|
|
+ bomModel.pageInput.pageSize = pageState.pageInput.pageSize;
|
|
|
+ await onQuery()
|
|
|
+})
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+// const formatterTime = (cellValue: any) => {
|
|
|
+// return dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss')
|
|
|
+// }
|
|
|
+
|
|
|
+//const getInitialIndex = (imgUrl: string) => {
|
|
|
+//return previewImglist.value.indexOf(imgUrl)
|
|
|
+//}
|
|
|
+
|
|
|
+const onQuery = async () => {
|
|
|
+ //bomModel.loading = true
|
|
|
+ // debugger
|
|
|
+ let filter = {...bomModel.filterModel };
|
|
|
+ if (!filter.bomType) {
|
|
|
+ // 如果bomType为空,即选择了“所有”,从过滤条件中删除该字段
|
|
|
+ delete filter.bomType;
|
|
|
+ }
|
|
|
+ // const res = await new ComponentApi().getPage({ ...bomModel.pageInput, filter: bomModel.filterModel }).catch(() => {
|
|
|
+ // bomModel.loading = false
|
|
|
+ // })
|
|
|
+ // bomModel.bomListData = res?.data?.list
|
|
|
+ // // .map(item => ({
|
|
|
+ // // ...item,
|
|
|
+ // // key_name:componentStatus.value?.get(item.key_name) ?? '',
|
|
|
+ // // stand_name:componentStatus.value?.get(item.stand_name) ?? '',
|
|
|
+ // // status:componentStatusType.value?.get(item.status) ?? ''
|
|
|
+ // // }))
|
|
|
+ // bomModel.total = res?.data?.total ?? 0
|
|
|
+ // bomModel.loading = false
|
|
|
+}
|
|
|
+
|
|
|
+/**重置表单*/
|
|
|
+const onReset = () => {
|
|
|
+ resetSearchForm()
|
|
|
+ onQuery()
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 重置表单
|
|
|
+ */
|
|
|
+const resetSearchForm = () => {
|
|
|
+ bomModel.filterModel.bomType = ''
|
|
|
+ bomModel.filterModel.bomName = ''
|
|
|
+ bomModel.filterModel.bomProNo = ''
|
|
|
+ bomModel.filterModel.bomMateNo = ''
|
|
|
+ bomModel.filterModel.barcode = ''
|
|
|
+ bomModel.filterModel.manufacturer = ''
|
|
|
+ bomModel.pageInput.currentPage = 1
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 页条变化
|
|
|
+ * @param val
|
|
|
+ */
|
|
|
+const onSizeChange = (val: number) => {
|
|
|
+ bomModel.pageInput.pageSize = val
|
|
|
+ onQuery()
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 页数变化
|
|
|
+ * @param val
|
|
|
+ */
|
|
|
+const onCurrentChange = (val: number) => {
|
|
|
+ bomModel.pageInput.currentPage = val
|
|
|
+ onQuery()
|
|
|
+}
|
|
|
+
|
|
|
+const onUpload = () => {
|
|
|
+ fileUploadRef.value.open()
|
|
|
+}
|
|
|
+
|
|
|
+const toPage = (row) => {
|
|
|
+ router.push({ path: `/product/${row.guid}` })
|
|
|
+}
|
|
|
+
|
|
|
+//const onDelete = (row: FileGetPageOutput) => {
|
|
|
+//proxy.$modal
|
|
|
+//.confirmDelete(`确定要删除文件【${row.fileName}${row.extension}】?`)
|
|
|
+//.then(async () => {
|
|
|
+//await new BomApi().delete({ id: row.id as number }, { loading: true, showSuccessMessage: true })
|
|
|
+// onQuery()
|
|
|
+// })
|
|
|
+// .catch(() => {})
|
|
|
+// }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.el-input,
|
|
|
+.el-select {
|
|
|
+ width: 240px;
|
|
|
+}
|
|
|
+
|
|
|
+/* 输入框标签固定四个字符宽度 */
|
|
|
+::v-deep .el-form-item__label {
|
|
|
+ // 字体大小14,4个字符,12px右间距
|
|
|
+ width: 14*4px+12px;
|
|
|
+ justify-content: start;
|
|
|
+}
|
|
|
+
|
|
|
+/* 数据表头 设置灰色样式 */
|
|
|
+::v-deep .el-table th.el-table__cell {
|
|
|
+ background-color: #F6F6F6;
|
|
|
+}
|
|
|
+</style>
|