Commit 4a18b776 authored by wangjiancheng's avatar wangjiancheng

refactor:国际关键零部件清单模板、国际关键零部件详情页面

parent 7c9d4ec6
import request from '@/utils/request'
// 查询国际关键零部件清单列表
export function listBaseInternational(query) {
return request({
url: '/control/baseInternationalKeyComponentsList/list',
method: 'get',
params: query
})
}
// 查询国际关键零部件清单详细
export function getBaseInternational(id) {
return request({
url: '/control/baseInternationalKeyComponentsList/' + id,
method: 'get'
})
}
// 新增国际关键零部件清单
export function addBaseInternational(data) {
return request({
url: '/control/baseInternationalKeyComponentsList/add',
method: 'post',
data: data,
headers: {
'Content-Type': 'multipart/form-data'
}
})
}
// 修改国际关键零部件清单
export function updateBaseInternational(data) {
return request({
url: '/control/baseInternationalKeyComponentsList',
method: 'put',
data: data
})
}
// 逻辑删除国际关键零部件清单
export function delLogic(id) {
return request({
url: '/control/baseInternationalKeyComponentsList/' + id,
method: 'delete'
})
}
// 升版
export function upgradeBaseInternational(id) {
return request({
url: '/control/baseInternationalKeyComponentsList/upGrade/' + id,
method: 'post'
})
}
// 生成清单版本号、清单号
export function getBaseInternationalNo() {
return request({
url: '/control/baseInternationalKeyComponentsList/generateInfo',
method: 'get'
})
}
// 修改数据状态
export function updateBaseInternationalStatus(id) {
return request({
url: '/control/baseInternationalKeyComponentsList/updateStatus/' + id ,
method: 'put'
})
}
// 获取国际关键零部件清单模板的事业部
export function getBaseInternationalDepartment() {
return request({
url: '/control/baseInternationalKeyComponentsList/getAllUnit',
method: 'get'
})
}
import request from '@/utils/request'
// 查询国际关键零部件清单详情列表
export function listDetail(query) {
return request({
url: '/control/baseInternationalKeyComponentsDetail/list',
method: 'get',
params: query
})
}
// 查询国际关键零部件清单详情详细
export function getDetail(id) {
return request({
url: '/control/baseInternationalKeyComponentsDetail/' + id,
method: 'get'
})
}
// 新增国际关键零部件清单详情
export function addDetail(data) {
return request({
url: '/control/baseInternationalKeyComponentsDetail',
method: 'post',
data: data
})
}
// 修改国际关键零部件清单详情
export function updateDetail(data) {
return request({
url: '/control/baseInternationalKeyComponentsDetail',
method: 'put',
data: data
})
}
// 删除国际关键零部件清单详情
export function delDetail(componentsListId) {
return request({
url: '/control/baseInternationalKeyComponentsDetail/' + componentsListId,
method: 'delete'
})
}
......@@ -9,14 +9,6 @@ export function listTemplate(query) {
})
}
// 查询国际关键零部件模版详细
export function getTemplate(id) {
return request({
url: '/control/baseIntlPartTemplate/' + id,
method: 'get'
})
}
// 新增国际关键零部件模版
export function addTemplate(data) {
return request({
......@@ -35,14 +27,6 @@ export function updateTemplate(data) {
})
}
// 删除国际关键零部件模版
export function delTemplate(id) {
return request({
url: '/control/baseIntlPartTemplate/' + id,
method: 'delete'
})
}
// 逻辑删除国际关键零部件模版
export function delLogicTemplate(id) {
return request({
......
<script setup>
</script>
<template>
关键零部件清单-国内
</template>
<style scoped lang="scss">
</style>
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="120px">
<el-form-item label="事业部" prop="division">
<el-input
v-model="queryParams.division"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="适用市场" prop="applicableMarket">
<el-input
v-model="queryParams.applicableMarket"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="车型代码" prop="modelCode">
<el-input
v-model="queryParams.modelCode"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="动力类型" prop="powerType">
<el-input
v-model="queryParams.powerType"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="发动机型号" prop="engineModel">
<el-input
v-model="queryParams.engineModel"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="动力电池型号" prop="powerBatteryModel">
<el-input
v-model="queryParams.powerBatteryModel"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="变速器型号" prop="transmissionModel">
<el-input
v-model="queryParams.transmissionModel"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="清单版本号" prop="listVersion">
<el-input
v-model="queryParams.listVersion"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="品牌" prop="brand">
<el-input
v-model="queryParams.brand"
placeholder="请输入品牌"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="数据状态" prop="dataStatus">
<el-select v-model="queryParams.dataStatus" placeholder="请选择" clearable size="default" style="width: 193px">
<el-option
v-for="dict in dataStatusOptions"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="清单编号" prop="listCode">
<el-input
v-model="queryParams.listCode"
placeholder="请输入清单编号"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button class="btn-A" icon="Search" @click="handleQuery">搜索</el-button>
<el-button class="btn-B" icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row>
<el-col :offset="21">
<el-button
class="btn-A"
@click="handleDownload"
>下载模板
</el-button>
<el-button
class="btn-C"
@click="handleAdd"
>新增清单
</el-button>
</el-col>
</el-row>
<!-- 列表 -->
<el-table v-loading="loading" :data="baseInternationalList">
<el-table-column label="序号" type="index" width="75" align="center"/>
<el-table-column label="事业部" align="center" prop="division" width="100" sortable/>
<el-table-column label="适用市场" align="center" prop="applicableMarket" width="100" sortable>
<template #default="scope">
{{ isNotEmpty(scope.row.applicableMarket) }}
</template>
</el-table-column>
<el-table-column label="车型代码" align="center" prop="modelCode" width="100" sortable/>
<el-table-column label="动力类型" align="center" prop="powerType" width="100" sortable/>
<el-table-column label="发动机型号" align="center" prop="engineModel" width="126" sortable>
<template #default="scope">
{{ isNotEmpty(scope.row.engineModel) }}
</template>
</el-table-column>
<el-table-column label="动力电池型号" align="center" prop="powerBatteryModel" width="126" sortable>
<template #default="scope">
{{ isNotEmpty(scope.row.powerBatteryModel) }}
</template>
</el-table-column>
<el-table-column label="变速器型号" align="center" prop="transmissionModel" width="150" sortable>
<template #default="scope">
{{ isNotEmpty(scope.row.transmissionModel) }}
</template>
</el-table-column>
<el-table-column label="清单版本号" align="center" prop="listVersion" width="120" sortable/>
<el-table-column label="修订日期" align="center" prop="updateTime" width="120" sortable>
<template #default="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') || '--' }}</span>
</template>
</el-table-column>
<el-table-column label="品牌" align="center" prop="brand" width="120" sortable>
<template #default="scope">
{{ isNotEmpty(scope.row.brand) }}
</template>
</el-table-column>
<el-table-column label="数据状态" align="center" prop="dataStatus" width="150" sortable/>
<el-table-column label="清单编号" align="center" prop="listCode" width="100" sortable/>
<el-table-column label="操作" align="center" fixed="right" width="260px">
<template #default="scope">
<el-button link type="primary" @click="handleUpdate(scope.row)" v-if="scope.row.dataStatus === '未生效'">
编辑
</el-button>
<el-button link type="primary" @click="handleView(scope.row)">查看数据</el-button>
<el-button link type="primary" @click="handleUpGrade(scope.row)" v-if="scope.row.dataStatus === '已生效'">
升版
</el-button>
<el-button link type="primary" @click="handleUpload(scope.row)" v-if="scope.row.dataStatus === '未生效'">
上传文件
</el-button>
<el-button link type="danger" @click="handleUndo(scope.row)" v-if="scope.row.dataStatus === '未生效'">删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加对话框 -->
<el-drawer title="新增国际关键零部件清单" v-model="openAdd" direction="rtl">
<el-form ref="baseInternationalRef" :model="form" :rules="rules" label-position="top" label-width="auto"
label-suffix=":">
<el-form-item label="市场" prop="applicableMarket">
<el-select v-model="form.applicableMarket" placeholder="请选择" multiple>
<el-option
v-for="(item, index) in applicableMarketOptions"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="事业部" prop="division">
<el-select v-model="form.division" placeholder="请选择">
<el-option
v-for="item in divisionNameOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="品牌" prop="brand">
<el-select v-model="form.brand" placeholder="请选择" multiple>
<el-option
v-for="item in brandOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="车型代码" prop="modelCode">
<el-select v-model="form.modelCode" placeholder="请选择">
<el-option
v-for="item in modelCodeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="动力类型" prop="powerType">
<el-select v-model="form.powerType" placeholder="请选择">
<el-option
v-for="item in powerTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item>
<el-tooltip content="添加" placement="bottom">
<el-button @click="addRow" circle>+</el-button>
</el-tooltip>
</el-form-item>
<div v-for="(items,index) in addForm.model" :key="index">
<el-row :gutter="20">
<el-col :span="7">
<el-form-item label="发动机型号" prop="engineModel">
<el-select v-model="items.engineModel" placeholder="请选择" style="width: 170px">
<el-option
v-for="item in engineModelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="动力电池型号" prop="powerBatteryModel">
<el-select v-model="items.powerBatteryModel" placeholder="请选择" style="width: 170px">
<el-option
v-for="item in powerBatteryModelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="变速器型号" prop="transmissionModel">
<el-select v-model="items.transmissionModel" placeholder="请选择" style="width: 170px">
<el-option
v-for="item in transmissionModelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="3">
<el-tooltip content="删除" placement="right">
<el-button @click="deleteRow(index)" v-show="addForm.model.length > 1" circle>-</el-button>
</el-tooltip>
</el-col>
</el-row>
</div>
</el-row>
<el-form-item label="关键零部件清单文件" prop="file">
<el-upload
ref="upload"
:auto-upload="false"
:limit="1"
:on-change="handleFileChange"
>
<el-button>选择文件</el-button>
</el-upload>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="清单版本号" prop="listVersion">
<el-input v-model="form.listVersion" placeholder="请输入清单版本号" disabled/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="清单编号" prop="listCode">
<el-input v-model="form.listCode" placeholder="请输入清单编号" disabled/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitForm">提交</el-button>
</div>
</template>
</el-drawer>
<!--编辑对话框-->
<el-drawer :title="title" v-model="openEdit" direction="rtl">
<el-form ref="baseInternationalRef" :model="form" :rules="rules" label-position="top" label-width="auto"
label-suffix=":">
<el-form-item label="市场" prop="applicableMarket">
<el-select v-model="form.applicableMarket" placeholder="请选择" multiple>
<el-option
v-for="(item, index) in applicableMarketOptions"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="事业部" prop="division">
<el-select v-model="form.division" placeholder="请选择">
<el-option
v-for="item in divisionNameOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="品牌" prop="brand">
<el-select v-model="form.brand" placeholder="请选择" multiple>
<el-option
v-for="item in brandOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="车型代码" prop="modelCode">
<el-select v-model="form.modelCode" placeholder="请选择">
<el-option
v-for="item in modelCodeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="动力类型" prop="powerType">
<el-select v-model="form.powerType" placeholder="请选择">
<el-option
v-for="item in powerTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item>
<el-tooltip content="添加" placement="bottom">
<el-button @click="addRow" circle>+</el-button>
</el-tooltip>
</el-form-item>
<div v-for="(items,index) in addForm.model" :key="index">
<el-row :gutter="20">
<el-col :span="7">
<el-form-item label="发动机型号" prop="engineModel">
<el-select v-model="items.engineModel" placeholder="请选择" style="width: 170px">
<el-option
v-for="item in engineModelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="动力电池型号" prop="powerBatteryModel">
<el-select v-model="items.powerBatteryModel" placeholder="请选择" style="width: 170px">
<el-option
v-for="item in powerBatteryModelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="变速器型号" prop="transmissionModel">
<el-select v-model="items.transmissionModel" placeholder="请选择" style="width: 170px">
<el-option
v-for="item in transmissionModelOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="3">
<el-tooltip content="删除" placement="right">
<el-button @click="deleteRow(index)" v-show="addForm.model.length > 1" circle>-</el-button>
</el-tooltip>
</el-col>
</el-row>
</div>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitForm">提交</el-button>
</div>
</template>
</el-drawer>
<!-- 下载模板对话框-->
<el-dialog v-model="openTemplate" title="下载模板" width="600px">
<el-alert title="请根据车型管理归属事业部,选择正确的模板下载填写" type="warning" show-icon :closable="false"/>
<el-table :data="downLoadForm">
<el-table-column prop="divisionCn" label="事业部" align="center"/>
<el-table-column prop="fileUrl" label="下载模板" align="center">
<template #default="scope">
<el-link type="primary" :underline="false" @click="downloadTemplate(scope.row)">下载关键零部件清单模板
</el-link>
</template>
</el-table-column>
</el-table>
</el-dialog>
<!-- 上传文件对话框 -->
<el-dialog v-model="openUpload" title="上传文件" width="600px">
<el-form ref="baseInternationalRef" :model="form" label-width="auto" :rules="rules" label-position="top" label-suffix=":">
<el-form-item label="关键零部件清单文件" prop="file">
<el-upload
ref="upload"
:auto-upload="false"
:limit="1"
:on-change="handleFileChange"
>
<el-button>选择文件</el-button>
</el-upload>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitUploadForm">提交</el-button>
</div>
</template>
</el-dialog>
<!-- 升版对话框 -->
<el-drawer v-model="openUpgrade" title="升版" width="600px">
<el-form ref="baseInternationalRef" :model="form" label-width="auto" :rules="rules" label-suffix=":"
label-position="top">
<el-form-item label="关键零部件清单文件" prop="file">
<el-upload
ref="upload"
:auto-upload="false"
:limit="1"
:on-change="handleFileChange"
>
<el-button>选择文件</el-button>
</el-upload>
</el-form-item>
</el-form>
<el-form :model="form" label-width="110" :rules="rules" label-suffix=":" label-position="left">
<el-form-item label="市场">
{{ isNotEmpty(form.applicableMarket) }}
</el-form-item>
<el-form-item label="事业部">
{{ form.division }}
</el-form-item>
<el-form-item label="品牌">
{{ isNotEmpty(form.brand) }}
</el-form-item>
<el-form-item label="车型代码">
{{ form.modelCode }}
</el-form-item>
<el-form-item label="动力车型">
{{ form.powerType }}
</el-form-item>
<el-form-item label="发动机型号">
{{ isNotEmpty(form.engineModel) }}
</el-form-item>
<el-form-item label="动力电池型号">
{{ isNotEmpty(form.powerBatteryModel) }}
</el-form-item>
<el-form-item label="变速器型号">
{{ isNotEmpty(form.transmissionModel) }}
</el-form-item>
<el-form-item label="市场">
{{ isNotEmpty(form.applicableMarket) }}
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitUpgradeForm(form.id)">提交</el-button>
</div>
</template>
</el-drawer>
<!-- 删除提示框-->
<el-dialog
v-model="undoDialogVisible"
title=""
align-center
style="width: 400px;height: 195px;margin-top: 300px" :fullscreen="true"
>
<template #header>
<div>提示</div>
<div>Prompt</div>
</template>
<div style="display: flex;align-items: center;">
<el-icon style="color: orange;font-size: 18px;margin:5px">
<WarningFilled/>
</el-icon>
<div>
<div style="font-size: 14px">确认删除该数据吗?</div>
<div style="font-size: 14px">Are you sure you want to delete this data?</div>
</div>
</div>
<template #footer>
<div style="margin-top: 10px">
<el-button class="btn-B" @click="cancel">取消/Cancel</el-button>
<el-button class="btn-A" @click="handleDelete">确认/Confirm</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import {
listBaseInternational,
getBaseInternational,
delLogic,
addBaseInternational,
updateBaseInternational,
getBaseInternationalNo,
getBaseInternationalDepartment
} from "@/api/BaseInternationalKeyComponents/BaseInternationalKeyComponents.js";
import {getMarket} from "@/api/BaseIntlPartTemplate/BaseIntlPartTemplateDetail.js";
import {getAllUnit} from "@/api/BaseIntlPartTemplate/BaseIntlPartTemplate.js";
import {WarningFilled} from "@element-plus/icons-vue";
import request from '@/utils/request'
const {proxy} = getCurrentInstance();
const baseInternationalList = ref([]);
const baseInternationalRef = ref(null);
const openAdd = ref(false);
const openEdit = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const total = ref(0);
const title = ref("");
const applicableMarketOptions = ref([]);
const divisionNameOptions = ref([]);
const brandOptions = ref([]);
const modelCodeOptions = ref([]);
const powerTypeOptions = ref([]);
const engineModelOptions = ref([]);
const powerBatteryModelOptions = ref([]);
const transmissionModelOptions = ref([]);
const templateIdList = ref({
templateId: null
});
const downLoadForm = ref([]);
const openTemplate = ref(false);
const openUpgrade = ref(false);
const upload = ref(null);
const undoDialogVisible = ref(false);
const openUpload = ref(false);
const fileNew = ref(null);
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
id: null,
division: null,
brand: null,
applicableMarket: null,
modelCode: null,
powerType: null,
engineModel: null,
powerBatteryModel: null,
transmissionModel: null,
listVersion: null,
importStatus: null,
dataStatus: null,
listCode: null,
},
rules: {
// applicableMarket: [{required: true, message: "市场不能为空", trigger: "blur"}],
// division: [{required: true, message: "事业部不能为空", trigger: "blur"}],
// brand: [{required: true, message: "品牌不能为空", trigger: "blur"}],
// modelCode: [{required: true, message: "车型代码不能为空", trigger: "blur"}],
// powerType: [{required: true, message: "动力类型不能为空", trigger: "blur"}],
// listVersion: [{required: true, message: "清单版本号不能为空", trigger: "blur"}],
// listCode: [{required: true, message: "清单编号不能为空", trigger: "blur"}],
//file: [{ required: true, message: "关键零部件清单文件不能为空", trigger: "blur" }]
}
});
const {queryParams, form, rules} = toRefs(data);
const addForm = ref({
model: [{
engineModel: '',
powerBatteryModel: '',
transmissionModel: ''
}]
})
// 校验是否为空
function isNotEmpty(data) {
if (!data || Object.keys(data).length === 0) {
return '--'
}
return Object.values(data).join('、')
}
/** 查询国际关键零部件清单列表 */
function getList() {
loading.value = true;
listBaseInternational(queryParams.value).then(response => {
baseInternationalList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
const dataStatusOptions = [
{
value: '未生效',
label: '未生效'
},
{
value: '已生效',
label: '已生效'
}
];
// 获取下拉框
function getApplicableMarket() {
// 市场
getMarket().then(response => {
applicableMarketOptions.value = response.data;
});
// 事业部
getAllUnit(null).then(response => {
divisionNameOptions.value = response.data.map(item => {
return {
value: item.id,
label: item.businessUnitName
}
})
})
// 品牌 todo
brandOptions.value = [
{
value: '品牌1',
label: '品牌1'
},
{
value: '品牌2',
label: '品牌2'
},
{
value: '品牌3',
label: '品牌3'
},
]
// 车型代码 todo
modelCodeOptions.value = [
{
value: 'T18',
label: 'T18'
},
{
value: 'T19C',
label: 'T19C'
},
{
value: 'E03',
label: 'E03'
},
]
// 动力类型 todo
powerTypeOptions.value = [
{
value: '油电',
label: '油电'
},
{
value: '纯电',
label: '纯电'
},
]
// 发动机型号
engineModelOptions.value = [
{
value: '发动机1',
label: '发动机1'
},
{
value: '发动机2',
label: '发动机2'
}, {
value: '/',
label: '/'
}, {
value: '同上',
label: '同上'
}
]
// 动力电池型号
powerBatteryModelOptions.value = [
{
value: '动力电池1',
label: '动力电池1'
},
{
value: '动力电池2',
label: '动力电池2'
},
{
value: '/',
label: '/'
}, {
value: '同上',
label: '同上'
}
]
// 变速器型号
transmissionModelOptions.value = [
{
value: '变速器1',
label: '变速器1'
},
{
value: '变速器2',
label: '变速器2'
},
{
value: '/',
label: '/'
}, {
value: '同上',
label: '同上'
}
]
}
// 查看数据
function handleView(row) {
proxy.$router.push({
path: '/baseData/criticalPartsList/BaseInternationalKeyComponentsDetail',
// params: {
// row: row // 直接传递对象
// }
query: {
id: row.id,
division: row.division
}
})
}
// 取消按钮
function cancel() {
openAdd.value = false;
openEdit.value = false;
openUpgrade.value = false;
undoDialogVisible.value = false;
openUpload.value = false
openTemplate.value = false
reset();
}
// 表单重置
function reset() {
addForm.value = {
model: [{
engineModel: '',
powerBatteryModel: '',
transmissionModel: ''
}]
}
addForm.value.model.length = 1
fileNew.value = null
uploadId.value = null
form.value = {
id: null,
division: null,
brand: [],
applicableMarket: [],
modelCode: null,
powerType: null,
engineModel: null,
powerBatteryModel: null,
transmissionModel: null,
listVersion: null,
importStatus: null,
dataStatus: null,
listCode: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
delFlag: null
};
proxy.resetForm("baseInternationalRef");
}
// 文件变更处理
const handleFileChange = (file) => {
fileNew.value = file.raw;
}
const uploadId = ref(null)
// 上传文件
function handleUpload(row) {
openUpload.value = true;
uploadId.value = row.id
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
// 获取下载模板的事业部
function handleDownloadTemplate() {
getBaseInternationalDepartment().then(response => {
downLoadForm.value = response.data
}).catch(() => {
proxy.$modal.msgError("加载模板数据失败");
});
}
// 新增:根据事业部ID查找模板数据
function downloadTemplate1(selectedDivision) {
// 根据事业部ID查找模板数据
const templateData = downLoadForm.value.find(item =>
item.division.includes(selectedDivision)
);
if (templateData) {
templateIdList.value.templateId = templateData.id;
proxy.download('control/baseIntlPartTemplateDetail/export', {
...templateIdList.value
}, `国际关键零部件清单模版(${isNotEmpty(templateData.divisionCn)})-${new Date().getFullYear()}${new Date().getMonth() + 1}${new Date().getDate()}.xlsx`);
openTemplate.value = false;
} else {
proxy.$modal.msgError("未找到对应事业部的模板");
}
}
// 打开下载模板对话框
function handleDownload() {
handleDownloadTemplate()
openTemplate.value = true
}
// 下载模板
function downloadTemplate(row) {
templateIdList.value.templateId = row.id
proxy.download('control/baseIntlPartTemplateDetail/export', {
...templateIdList.value
}, `国际关键零部件清单模版(${isNotEmpty(row.divisionCn)})-${new Date().getFullYear()}${new Date().getMonth() + 1}${new Date().getDate()}.xlsx`)
openTemplate.value = false
}
// 添加一项
function addRow() {
const newList = {
engineModel: null,
powerBatteryModel: null,
transmissionModel: null,
};
addForm.value.model.push(newList);
}
// 删除一项
function deleteRow(index) {
if (addForm.value.model.length !== 1) {
addForm.value.model.splice(index, 1);
}
}
/** 新增按钮操作 */
function handleAdd() {
reset();
getBaseInternationalNo().then(response => {
form.value.listCode = response.data.listCode;
form.value.listVersion = response.data.listVersion;
})
// 新增:预加载模板数据
handleDownloadTemplate();
openAdd.value = true;
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
getBaseInternational(row.id).then(response => {
form.value = response.data;
addForm.value.model = response.data.model;
openEdit.value = true;
title.value = "编辑国际关键零部件清单(" + form.value.listCode + ")";
});
}
/** 新增/编辑--提交按钮 */
function submitForm() {
proxy.$refs["baseInternationalRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateBaseInternational(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
openEdit.value = false;
getList();
});
} else {
form.value.model = addForm.value.model;
if (!fileNew.value){
proxy.$modal.msgError("请上传文件");
return;
}
// 封装数据
const formData = new FormData();
formData.append('baseInternationalKeyComponentsList', JSON.stringify(form.value));
formData.append('file', fileNew.value);
addBaseInternational(formData).then(response => {
if (response.msg != null) {
proxy.$modal.msgSuccess("新增成功");
openAdd.value = false;
fileNew.value = null;
getList();
}
});
}
}
});
}
// 升版--提交按钮
function submitUpgradeForm(id) {
proxy.$refs["baseInternationalRef"].validate(valid => {
const formData = new FormData();
if (fileNew.value) {
formData.append('file', fileNew.value);
}else {
proxy.$modal.msgError("请上传文件");
return;
}
request('/control/baseInternationalKeyComponentsList/upGrade/' + id, {
method: 'post',
data: formData,
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(response => {
if (response.code === 200){
proxy.$modal.msgSuccess("升版成功");
openUpgrade.value = false;
fileNew.value = null
getList();
}
})
});
}
// 上传文件--提交按钮
function submitUploadForm() {
proxy.$refs["baseInternationalRef"].validate(valid => {
const formData = new FormData();
if (fileNew.value) {
formData.append('file', fileNew.value);
}else {
proxy.$modal.msgError("请上传文件");
return;
}
request('/control/baseInternationalKeyComponentsDetail/importData/' + uploadId.value, {
method: 'post',
data: formData,
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(response => {
if (response.code === 200){
proxy.$modal.msgSuccess(response.msg);
openUpload.value = false;
uploadId.value = null;
fileNew.value = null
getList();
}
})
});
}
const delId = ref(null)
// 打开删除对话框
function handleUndo(row) {
undoDialogVisible.value = true;
delId.value = row.id
}
/** 删除按钮操作 */
function handleDelete() {
return delLogic(delId.value).then(() => {
undoDialogVisible.value = false;
delId.value = null
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => {
});
}
// 升版
function handleUpGrade(row) {
getBaseInternational(row.id).then(response => {
form.value = response.data;
openUpgrade.value = true
});
}
getList();
getApplicableMarket();
</script>
<style scoped lang="scss">
.el-row {
margin-bottom: 20px;
}
:deep(.el-pagination) {
display: flex;
justify-content: center;
width: 100%;
margin-top: 24px;
}
:deep(.el-pagination.is-background .el-pager li.is-active) {
background-color: #0154FB;
}
/*对话框中央*/
:deep(.el-dialog) {
margin-top: 15% !important;
}
</style>
<template>
<div class="app-container">
<el-row >
<el-col :span="22">
<el-descriptions :column="5">
<el-descriptions-item width="100px">
<el-button link @click="onBack" icon="ArrowLeft">返回</el-button>
</el-descriptions-item>
<el-descriptions-item label="事业部:" width="130px">
{{division}}
</el-descriptions-item>
<el-descriptions-item label="车型类型:" width="200px">
{{row.modelCode}}
</el-descriptions-item>
<el-descriptions-item label="清单编号:" width="240px" >
{{row.listCode}}
</el-descriptions-item>
<el-descriptions-item label="适用市场:">
{{isNotEmpty(row.applicableMarket)}}
</el-descriptions-item>
</el-descriptions>
</el-col>
<el-col :span="2">
<el-button link type="success" v-if="row.dataStatus === '已生效'">已生效</el-button>
<el-button type="primary" @click="handleUpdateDataStatus(row.id)" v-else>生效</el-button>
<el-button link type="danger" v-if="row.dataStatus === '未生效'">未生效</el-button>
</el-col>
</el-row>
<el-descriptions :column="5" border style="margin-bottom: 20px" >
<el-descriptions-item label="动力类型:">
{{row.powerType}}
</el-descriptions-item>
<el-descriptions-item label="发动机型号:">
{{isNotEmpty(row.engineModel)}}
</el-descriptions-item>
<el-descriptions-item label="电池型号:">
{{isNotEmpty(row.powerBatteryModel)}}
</el-descriptions-item>
<el-descriptions-item label="变速器型号:">
{{isNotEmpty(row.transmissionModel)}}
</el-descriptions-item>
<el-descriptions-item label="清单版本号:">
{{row.listVersion}}
</el-descriptions-item>
</el-descriptions>
<!-- 搜索栏 -->
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="auto" label-suffix=":" >
<el-form-item label="零部件名称" prop="componentName">
<el-input
v-model="queryParams.componentName"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="英文名称" prop="englishName">
<el-input
v-model="queryParams.englishName"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="型号" prop="model">
<el-input
v-model="queryParams.model"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="生产厂家" prop="manufacturer">
<el-input
v-model="queryParams.manufacturer"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="生产厂家(英文)" prop="manufacturerEnglish">
<el-input
v-model="queryParams.manufacturerEnglish"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="零部件认证证书号/注册号" prop="certificationNumber">
<el-input
v-model="queryParams.certificationNumber"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="零部件认证标记要求" prop="certificationMarkRequirements">
<el-input
v-model="queryParams.certificationMarkRequirements"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="专业部门" prop="professionalDepartment">
<el-input
v-model="queryParams.professionalDepartment"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="p8后批量生产单位" prop="p8PostProductionUnit">
<el-input
v-model="queryParams.p8PostProductionUnit"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="零件总成号" prop="componentPartUmber">
<el-input
v-model="queryParams.componentPartUmber"
placeholder="请输入"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button class="btn-A" icon="Search" @click="handleQuery">搜索</el-button>
<el-button class="btn-B" icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form >
<el-row style="margin-bottom: 10px" v-if="row.dataStatus === '未生效'">
<el-col :offset="21">
<el-button
class="btn-C"
@click="handleUpload"
>上传文件</el-button>
<el-button
type="warning"
plain
@click="handleVerify"
>校对生产厂</el-button>
</el-col>
</el-row>
<el-table v-loading="loading" :data="detailList" :row-class-name="tableRowClassName">
<el-table-column type="index" label="序号" width="75" align="center" />
<el-table-column label="零部件名称" align="center" prop="componentName" sortable>
<template #default="scope">
{{scope.row.componentName || '--'}}
</template>
</el-table-column>
<el-table-column label="英文名称" align="center" prop="englishName" sortable>
<template #default="scope">
{{scope.row.englishName || '--'}}
</template>
</el-table-column>
<el-table-column label="型号" align="center" prop="model" sortable>
<template #default="scope">
{{scope.row.model || '--'}}
</template>
</el-table-column>
<el-table-column label="生产厂家" align="center" prop="manufacturer" sortable>
<template #default="scope">
{{scope.row.manufacturer || '--'}}
</template>
</el-table-column>
<el-table-column label="生产厂家(英文)" align="center" prop="manufacturerEnglish" sortable>
<template #default="scope">
{{scope.row.manufacturerEnglish || '--'}}
</template>
</el-table-column>
<el-table-column label="零部件认证证书号/注册号" align="center" prop="certificationNumber" sortable>
<template #default="scope">
{{scope.row.certificationNumber || '--'}}
</template>
</el-table-column>
<el-table-column label="零部件认证标记要求" align="center" prop="certificationMarkRequirements" sortable>
<template #default="scope">
{{scope.row.certificationMarkRequirements || '--'}}
</template>
</el-table-column>
<el-table-column label="p8后批量生产单位" align="center" prop="p8PostProductionUnit" sortable>
<template #default="scope">
{{scope.row.p8PostProductionUnit || '--'}}
</template>
</el-table-column>
<el-table-column label="专业部门" align="center" prop="professionalDepartment" >
<template #default="scope">
{{scope.row.professionalDepartment || '--'}}
</template>
</el-table-column>
<el-table-column label="零件总成号" align="center" prop="componentPartUmber" >
<template #default="scope">
{{scope.row.componentPartUmber || '--'}}
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" >
<template #default="scope">
{{scope.row.remark || '--'}}
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" v-if="row.dataStatus === '已生效'">
<template #default="scope">
<el-button
link
type="primary"
@click="handleUpdate(scope.row)"
>编辑</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 上传文件对话框 -->
<el-dialog v-model="openUpload" title="上传文件" width="500px">
<el-form ref="baseInternationalRef" label-width="auto" label-position="top" label-suffix=":">
<el-form-item label="关键零部件清单文件" prop="fileUrl">
<el-upload
ref="upload"
:auto-upload="false"
:limit="1"
:on-change="handleFileChange"
>
<el-button>选择文件</el-button>
</el-upload>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitUploadForm">提交</el-button>
</div>
</template>
</el-dialog>
<!-- 编辑对话框 -->
<el-dialog title="编辑" v-model="open" width="500px">
<el-form ref="detailRef" :model="form" :rules="rules" label-width="128px">
<el-form-item label="p8后批量生产单位" prop="p8PostProductionUnit">
<el-select v-model="form.p8PostProductionUnit" placeholder="请选择">
<el-option
v-for="dict in p8_post_production_unit"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="零件总成号" prop="componentPartUmber">
<el-input v-model="form.componentPartUmber" placeholder="请填写" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitForm">提交</el-button>
</div>
</template>
</el-dialog>
<!--填写校对备注-->
<el-dialog title="填写校对备注" v-model="openVerifyRemark" width="500px">
<el-form :model="form">
<el-form-item prop="verifyRemark">
<el-input
type="textarea"
maxlength="100"
style="width: 500px"
show-word-limit
v-model="form.verifyRemark"
:rows="10"
placeholder="输入内容"
/>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
<el-button class="btn-B" @click="submitForm">提交</el-button>
</div>
</template>
</el-dialog>
<!-- 查看校对备注-->
<el-dialog title="查看校对备注" v-model="openReadVerifyRemark" width="500px">
<el-text>
{{form.verifyRemark}}
</el-text>
</el-dialog>
</div>
</template>
<script setup >
import {
listDetail,
updateDetail,
getDetail
} from "@/api/BaseInternationalKeyComponents/BaseInternationalKeyComponentsDetail.js";
import {getBaseInternational, updateBaseInternationalStatus} from "@/api/BaseInternationalKeyComponents/BaseInternationalKeyComponents.js";
const { proxy } = getCurrentInstance();
const { p8_post_production_unit } = proxy.useDict('p8_post_production_unit');
const detailList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const total = ref(0);
const openUpload = ref(false);
const openVerifyRemark = ref(false)
const openReadVerifyRemark = ref(false)
const baseInternationalRef = ref(null)
const fileNew = ref(null)
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
componentsListId: null,
componentName: null,
englishName: null,
model: null,
manufacturer: null,
manufacturerEnglish: null,
certificationNumber: null,
certificationMarkRequirements: null,
p8PostProductionUnit: null,
componentPartUmber: null,
professionalDepartment: null,
verifyRemark: null
},
rules: {
fileUrl: [{ required: true, message: "关键零部件清单文件不能为空", trigger: "blur" }]
}
});
const { queryParams, form, rules } = toRefs(data);
let division = proxy.$route.query.division;
let componentsListId = proxy.$route.query.id;
const row = ref({});
// 校验是否为空
function isNotEmpty(data) {
if (!data || Object.keys(data).length === 0) {
return '--'
}
return Object.values(data).join('、')
}
// 判断行样式的函数
function tableRowClassName({ row }) {
if (row.modelIsNull === '1') {
return 'red-row';
}
return '';
}
/** 查询国际关键零部件清单详情列表 */
function getList() {
loading.value = true;
queryParams.value.componentsListId = componentsListId
listDetail(queryParams.value).then(response => {
getBaseInt()
detailList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
// 查询国际关键零部件清单
function getBaseInt() {
getBaseInternational(componentsListId).then(response => {
row.value = response.data;
});
}
// 文件上传处理
const handleFileChange = (file) => {
fileNew.value = file.raw;
}
// 取消按钮
function cancel() {
openUpload.value = false;
open.value = false;
openVerifyRemark.value = false
reset();
}
// 表单重置
function reset() {
fileNew.value = null
form.value = {
id: null,
componentsListId: null,
componentName: null,
englishName: null,
model: null,
manufacturer: null,
manufacturerEnglish: null,
certificationNumber: null,
certificationMarkRequirements: null,
p8PostProductionUnit: null,
componentPartUmber: null,
professionalDepartment: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
delFlag: null
};
proxy.resetForm("detailRef");
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
// 修改数据状态
function handleUpdateDataStatus(componentsListId) {
updateBaseInternationalStatus(componentsListId).then(response => {
proxy.$modal.msgSuccess("修改成功");
getList();
});
}
// 校对生产厂 todo 进入页面自动加载
function handleVerify() {
// 根据componentsListId
}
// 填写校对备注 todo
function handleVerifyRemark(row) {
openVerifyRemark.value = true
form.value = row
}
// 查看校对备注 todo
function handleReadVerifyRemark(row) {
openReadVerifyRemark.value = true
form.value = row
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
getDetail(row.id).then(response => {
form.value = response.data;
open.value = true;
});
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["detailRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateDetail(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
}
}
});
}
// 上传文件--提交按钮
function submitUploadForm() {
proxy.$refs["baseInternationalRef"].validate(valid => {
const formData = new FormData();
if (fileNew.value) {
formData.append('file', fileNew.value);
}else {
proxy.$modal.msgError("请上传文件");
return;
}
request('/control/baseInternationalKeyComponentsDetail/importData/' + componentsListId, {
method: 'post',
data: formData,
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(response => {
if (response.code === 200){
proxy.$modal.msgSuccess(response.msg);
fileNew.value = null
openUpload.value = false;
getList();
}
})
})
}
// 上传文件
function handleUpload() {
openUpload.value = true;
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('control/detail/export', {
...queryParams.value
}, `detail_${new Date().getTime()}.xlsx`)
}
// 返回
function onBack() {
proxy.$router.push({ path: '/baseData/criticalPartsList/BaseInternationalKeyComponents'});
}
getList();
</script>
<style scoped>
/*:deep(.red-row) .el-table__cell .cell {
color: red !important;
}*/
:deep .el-table .red-row {
--el-table-tr-bg-color: var(--el-color-warning-light-9);
}
/*对话框中央*/
:deep(.el-dialog) {
margin-top: 15% !important;
}
</style>
......@@ -43,6 +43,9 @@
<div>{{en.UpdatedBy}}</div>
</div>
</template>
<template #default="scope">
{{scope.row.upateByName || '--'}}
</template>
</el-table-column>
<el-table-column label="更新时间" prop="updateTime" align="center">
<template #header>
......@@ -98,7 +101,11 @@
/>
<!-- 复制新增对话框 -->
<el-dialog :title="title" v-model="open" width="339px" align-center>
<el-dialog
:title="title"
v-model="open"
width="500px"
>
<el-form ref="templateRef" :model="form" label-width="80px">
<el-form-item label="事业部" prop="division">
<el-select v-model="form.division" placeholder="请选择">
......@@ -128,9 +135,14 @@
</div>
</template>
</el-dialog>
<!-- 添加事业部对话框 -->
<el-dialog :title="title" v-model="open2" width="500px" append-to-body>
<el-dialog
:title="title"
v-model="open2"
width="500px"
top="30"
>
<div style="width: 70%;margin-left: 15%;padding: 20px 0">
<el-form ref="templateRef" :model="form" label-width="80px">
<el-form-item label="事业部" prop="division">
<el-select v-model="form.division" placeholder="请选择">
......@@ -143,6 +155,7 @@
</el-select>
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="dialog-footer">
<el-button class="btn-A" @click="cancel">取消</el-button>
......@@ -154,7 +167,7 @@
</template>
<script setup>
import { listTemplate, addTemplate, getAllUnit, delLogicTemplate, updateTemplate } from "@/api/BaseIntlPartTemplate/baseIntlPartTemplate.js";
import { listTemplate, addTemplate, getAllUnit, delLogicTemplate, updateTemplate } from "@/api/BaseIntlPartTemplate/BaseIntlPartTemplate.js";
import cn from "@/locales/baseData/criticalPartsList/BaseIntlPartTemplate/cn.json";
import en from "@/locales/baseData/criticalPartsList/BaseIntlPartTemplate/en.json";
......@@ -241,6 +254,8 @@ function handleDivisionChange(selectedValue) {
if (oldDivisionId){
form.value.division = oldDivisionId.concat(selectedValue);
form.value.divisionCn = oldDivisionCn.concat(selectedOption.label);
oldDivisionId = [];
oldDivisionCn = [];
}else {
form.value.division.push(selectedValue);
form.value.divisionCn.push(selectedOption.label);
......@@ -268,7 +283,7 @@ function reset() {
/** 提交按钮 */
function submitForm() {
proxy.$refs["templateRef"].validate(valid => {
if (valid) {
if (valid && form.value.division) {
handleDivisionChange(form.value.division)
if (form.value.id != null) {
// 添加事业部
......@@ -303,3 +318,20 @@ function handleDelete(row) {
getList();
</script>
<style scoped lang="scss">
:deep(.el-pagination) {
display: flex;
justify-content: center;
width: 100%;
margin-top: 24px;
}
:deep(.el-pagination.is-background .el-pager li.is-active){
background-color: #0154FB;
}
/*对话框中央*/
:deep(.el-dialog) {
margin-top: 17% !important;
}
</style>
<template>
<div class="app-container">
<div style="margin-bottom: 20px">
<el-button
link
@click="back"
style="font-size: 16px;"
>
<el-icon>
<ArrowLeft/>
</el-icon>
返回
</el-button>
<!-- <span style="margin-left: 10px">-->
<!-- <el-text size="large">事业部:</el-text>-->
<!-- {{ Object.values(divisionCn).join('、') }}</span>-->
<!-- <span style="margin-left: 10px">-->
<!-- <el-text size="large">最近更新人:</el-text>-->
<!-- {{ latestUpdateByName }}</span>-->
<!-- 事业部信息 -->
<span class="business-unit">事业部: {{ Object.values(divisionCn).join('、') }}</span>
<el-row >
<el-col>
<el-descriptions :column="5">
<el-descriptions-item width="100px">
<el-button link @click="back" icon="ArrowLeft">返回</el-button>
</el-descriptions-item>
<el-descriptions-item label="更新人:" width="150">
{{ latestUpdateByName }}
</el-descriptions-item>
<el-descriptions-item label="事业部:">
{{ Object.values(divisionCn).join('、') }}
</el-descriptions-item>
</el-descriptions>
</el-col>
</el-row>
<!-- 更新人信息 -->
<span class="last-updated-by">最近更新人:{{ latestUpdateByName }}</span>
</div>
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="150px">
<el-form-item label="关键零部件名称:" prop="partNameId">
<el-input
......@@ -112,8 +106,7 @@
<el-row :gutter="46">
<el-col :offset="22">
<el-button
plain
type="primary"
class="btn-C"
@click="handleExport"
>导出模板
</el-button>
......@@ -151,7 +144,7 @@
:label="header"
>
<template #default="scope">
<!-- 判断当前乘客是否访问过该城市 -->
<!-- 判断当前零部件适用市场 -->
<el-icon v-if="scope.row.applicableMarketList.includes(header)" size="20px">
<Check/>
</el-icon>
......@@ -165,7 +158,7 @@
</el-table-column>
</el-table>
<el-drawer v-model="open" size="800px" direction="rtl" title="编辑零件">
<el-drawer v-model="open" size="500px" direction="rtl" title="编辑零件">
<template #default>
<el-form ref="detailRef" :model="form" :rules="rules" label-width="150px">
<el-form-item label="关键零部件名称:" prop="criticalPartNameCn">
......@@ -220,7 +213,7 @@
</template>
<script setup>
import {listDetail, getDetail, updateDetail, getMarket} from "@/api/BaseIntlPartTemplate/baseIntlPartTemplateDetail.js";
import {listDetail, getDetail, updateDetail, getMarket} from "@/api/BaseIntlPartTemplate/BaseIntlPartTemplateDetail.js";
import {ArrowLeft, Check} from "@element-plus/icons-vue";
const {proxy} = getCurrentInstance();
......@@ -381,7 +374,7 @@ function submitForm() {
function handleExport() {
proxy.download('control/baseIntlPartTemplateDetail/export', {
...queryParams.value
}, `国际关键零部件清单模版-${new Date().getFullYear()}${new Date().getMonth() + 1}${new Date().getDate()}.xlsx`)
}, `国际关键零部件清单模版(${divisionCn})-${new Date().getFullYear()}${new Date().getMonth() + 1}${new Date().getDate()}.xlsx`)
}
getList();
......@@ -393,21 +386,11 @@ getApplicableMarket();
margin-right: 15px;
}
.el-row {
margin-bottom: 20px;
}
.header-container {
display: flex;
align-items: center;
gap: 10px;
margin-left: 10px
:deep(.drawer-form.el-form--inline .el-form-item) {
margin-right: 15px;
}
.business-unit,
.last-updated-by {
margin-left: 10px;
font-size: 16px;
color: #606266;
.el-row {
margin-bottom: 20px;
}
</style>
<template>
<el-card>
<el-tabs v-model="activeName">
<el-tab-pane label="国内" name="BaseDomesticKeyComponents">
<BaseDomesticKeyComponents/>
</el-tab-pane>
<el-tab-pane label="国际" name="BaseInternationalKeyComponents">
<BaseInternationalKeyComponents/>
</el-tab-pane>
</el-tabs>
</el-card>
</template>
<script setup>
import BaseDomesticKeyComponents from "@/views/baseData/criticalPartsList/BaseDomesticKeyComponents/index.vue";
import BaseInternationalKeyComponents from "@/views/baseData/criticalPartsList/BaseInternationalKeyComponents/index.vue";
const activeName = ref("BaseDomesticKeyComponents");
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment